Browse Source

Popover: fix popover issues with hover display (#13104)

* Fix issue with popover displaying on focus when configuration is for it to show on hover.
Fix issue with popover timer still running when button clicked and parent element no longer visible (e.g. keepalive component).

* Updated to pass tests

* Correct documentation for el-date-picker

* Changes as per ziyoung review
Gideon King 6 years ago
parent
commit
911ca6872a
2 changed files with 17 additions and 2 deletions
  1. 2 0
      examples/docs/en-US/date-picker.md
  2. 15 2
      packages/popover/src/main.vue

+ 2 - 0
examples/docs/en-US/date-picker.md

@@ -373,6 +373,8 @@ Pay attention to capitalization
 | `yyyy` | year | | 2017 |
 | `M`  | month | no leading 0 | 1 |
 | `MM` | month | | 01 |
+| `MMM` | month | | Jan |
+| `MMMM` | month | | January |
 | `W`  | week | only for week picker's `format`; no leading 0 | 1 |
 | `WW` | week | only for week picker's `format`| 01 |
 | `d`  | day | no leading 0 | 2 |

+ 15 - 2
packages/popover/src/main.vue

@@ -123,6 +123,14 @@ export default {
     }
   },
 
+  beforeDestroy() {
+    this.cleanup();
+  },
+
+  deactivated() {
+    this.cleanup();
+  },
+
   methods: {
     doToggle() {
       this.showPopper = !this.showPopper;
@@ -135,14 +143,14 @@ export default {
     },
     handleFocus() {
       addClass(this.referenceElm, 'focusing');
-      if (this.trigger !== 'manual') this.showPopper = true;
+      if (this.trigger === 'click' || this.trigger === 'focus') this.showPopper = true;
     },
     handleClick() {
       removeClass(this.referenceElm, 'focusing');
     },
     handleBlur() {
       removeClass(this.referenceElm, 'focusing');
-      if (this.trigger !== 'manual') this.showPopper = false;
+      if (this.trigger === 'click' || this.trigger === 'focus') this.showPopper = false;
     },
     handleMouseEnter() {
       clearTimeout(this._timer);
@@ -186,6 +194,11 @@ export default {
     handleAfterLeave() {
       this.$emit('after-leave');
       this.doDestroy();
+    },
+    cleanup() {
+      if (this.openDelay) {
+        clearTimeout(this._timer);
+      }
     }
   },