Cascader: hoverThreshold configuable

ElemeFE · Nov 6, 2017 · e1865b0 · e1865b0
1 parent e185200
commit e1865b0
Show file tree

Hide file tree

Showing 2 changed files with 10 additions and 5 deletions.
diff --git a/packages/cascader/src/main.vue b/packages/cascader/src/main.vue
@@ -149,6 +149,10 @@ export default {
     beforeFilter: {
       type: Function,
       default: () => (() => {})
+    },
+    hoverThreshold: {
+      type: Number,
+      default: 500
     }
   },
 
@@ -224,6 +228,7 @@ export default {
       this.menu.expandTrigger = this.expandTrigger;
       this.menu.changeOnSelect = this.changeOnSelect;
       this.menu.popperClass = this.popperClass;
+      this.menu.hoverThreshold = this.hoverThreshold;
       this.popperElm = this.menu.$el;
       this.menu.$on('pick', this.handlePick);
       this.menu.$on('activeItemChange', this.handleActiveItemChange);

diff --git a/packages/cascader/src/menu.vue b/packages/cascader/src/menu.vue
@@ -39,7 +39,8 @@
         value: [],
         expandTrigger: 'click',
         changeOnSelect: false,
-        popperClass: ''
+        popperClass: '',
+        hoverTimer: 0
       };
     },
 
@@ -135,13 +136,12 @@
         activeOptions,
         visible,
         expandTrigger,
-        popperClass
+        popperClass,
+        hoverThreshold
       } = this;
 
       let hoverMenuRefs = {};
-      this.hoverTimer = null;
       const hoverMenuHandler = e => {
-        const hoverHreshold = 500;
         const offsetX = e.offsetX;
         const width = hoverMenuRefs.activeMenu.offsetWidth;
         const height = hoverMenuRefs.activeMenu.offsetHeight;
@@ -160,7 +160,7 @@
           if (!this.hoverTimer) {
             this.hoverTimer = setTimeout(() => {
               hoverMenuRefs.hoverZone.innerHTML = '';
-            }, hoverHreshold);
+            }, hoverThreshold);
           }
         }
       };