最新封装了一个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’