-vue的防抖
需求:输入框输入查询列表(一开始直接把查询接口赋值给input事件,每次输入都向后端发请求) 自我记录
踩坑1:
直接定义一个防抖函数debounce赋值给input的input的事件
一开始以为是定时器的问题 后面检查发现没有问题 网上开始查询资料
只是返回了function回调函数 并不会执行
因为vue要触发事件才会执行当前的函数 直接赋值shakeInit只是执行shakeInit函数,不触发返回值
源码了解一下?
初始化组件中 initState的过程中初始化了methods
初始化methods的过程中
主要是挂载methods到组件实例上
改为返回自执行函数
报错了
踩坑2:
上图中不执行的函数中的this不指向当前实例 是undefined
所以需要绑定当前组件实例传入
但是这样并没有达到防抖的效果 函数还是立即执行 只是延迟执行
finally:
在初始化的时候将防抖函数赋值给input回调并执行