最新封裝了一個vue防抖節流自定義指令,發佈到npm上,有用歡迎star,謝謝!vue
npm地址:https://www.npmjs.com/package/v-debounce-throttlegit
github地址:https://github.com/gerryli0214/vue-directivesgithub
使用比較簡單,取消利用vue註冊事件,採用指令來註冊事件,防抖指令v-debounce,節流指令v-debounce,使用方式分爲兩種,傳入對象和採用修飾符,具體文檔以下:npm
參數名稱spa |
數據類型對象 |
必填seo |
默認值事件 |
備註ci |
fun文檔 |
String |
true |
空 |
|
event |
String |
false |
click |
|
args |
Any |
false |
空 |
|
wait |
Number |
false |
200 |
|
備註:
一、 modifiers爲指令修飾符,默認與vue事件綁定保持一致,目前支持的事件類型:click,dblclick,keyup,keydown,keypress,mouseup,mousedown,mouseover,mouseleave,scroll,事件修飾符stop => 阻止默認事件,prev => 阻止事件冒泡
二、 自定義指令默認經過原生JS註冊元素事件,在按鈕元素上使用的時候,須要移出經過v-on(@)綁定的事件
三、防抖v-debounce,節流v-throttle
v-debounce=」funName」
v-debounce=」{fun: ‘xxx’, event: ‘xxx’}」
v-debounce.click.stop=’funName’