Dropdown: allow change show/hide timeout by props (#7621)

* Dropdown: Allow change show/hide timeout by props

* Dropdown: Fixes for document mistake

examples/docs/en-US/dropdown.md

@@ -210,6 +210,8 @@ Clicking each dropdown item fires an event whose parameter is assigned by each i
 | menu-align    | horizontal alignment     | string          | start/end  | end |
 | trigger       | how to trigger     | string  |    hover/click  |  hover |
 | hide-on-click | whether to hide menu after clicking menu-item     | boolean          | — | true |
+| show-timeout | Delay time before show a dropdown     | number          | — | 250 |
+| hide-timeout | Delay time before hide a dropdown     | number          | — | 150 |
 
 ### Dropdown Events
 | Event Name | Description | Parameters |

packages/dropdown/src/dropdown.vue

@@ -33,6 +33,14 @@
       hideOnClick: {
         type: Boolean,
         default: true
+      },
+      showTimeout: {
+        type: Number,
+        default: 250
+      },
+      hideTimeout: {
+        type: Number,
+        default: 150
       }
     },
 
@@ -62,14 +70,14 @@
         clearTimeout(this.timeout);
         this.timeout = setTimeout(() => {
           this.visible = true;
-        }, 250);
+        }, this.showTimeout);
       },
       hide() {
         if (this.triggerElm.disabled) return;
         clearTimeout(this.timeout);
         this.timeout = setTimeout(() => {
           this.visible = false;
-        }, 150);
+        }, this.hideTimeout);
       },
       handleClick() {
         if (this.triggerElm.disabled) return;