@@ -91,7 +91,8 @@
data () {
return {
prefixCls: prefixCls,
- showTitle: true
+ showTitle: true,
+ isInput: false
};
},
computed: {
@@ -133,14 +134,14 @@
}
this.visible = false;
},
- handleFocus () {
- if (this.trigger !== 'focus' || this.confirm) {
+ handleFocus (fromInput = true) {
+ if (this.trigger !== 'focus' || this.confirm || (this.isInput && !fromInput)) {
return false;
}
this.visible = true;
},
- handleBlur () {
- if (this.trigger !== 'focus' || this.confirm) {
+ handleBlur (fromInput = true) {
+ if (this.trigger !== 'focus' || this.confirm || (this.isInput && !fromInput)) {
return false;
}
this.visible = false;
@@ -164,12 +165,41 @@
ok () {
this.visible = false;
this.$emit('on-ok');
+ },
+ getInputChildren () {
+ const $input = this.$els.reference.querySelectorAll('input');
+ const $textarea = this.$els.reference.querySelectorAll('textarea');
+ let $children = null;
+
+ if ($input.length) {
+ $children = $input[0];
+ } else if ($textarea.length) {
+ $children = $textarea[0];
+ }
+
+ return $children;
}
},
- ready () {
+ compiled () {
if (!this.confirm) {
this.showTitle = this.$els.title.innerHTML != `
`;
}
+ // if trigger and children is input or textarea,listen focus & blur event
+ if (this.trigger === 'focus') {
+ const $children = this.getInputChildren();
+ if ($children) {
+ $children.addEventListener('focus', this.handleFocus, false);
+ $children.addEventListener('blur', this.handleBlur, false);
+ this.isInput = true;
+ }
+ }
+ },
+ beforeDestroy () {
+ const $children = this.getInputChildren();
+ if ($children) {
+ $children.removeEventListener('focus', this.handleFocus, false);
+ $children.removeEventListener('blur', this.handleBlur, false);
+ }
}
};
diff --git a/test/routers/poptip.vue b/test/routers/poptip.vue
index d75277c..8cf282b 100644
--- a/test/routers/poptip.vue
+++ b/test/routers/poptip.vue
@@ -1,183 +1,22 @@
-
-
- 当鼠标经过这段文字时，会显示一个气泡框
-
-