节流
连续触发事件,但是在n秒中只执行一次函数
使用场景:轮播图点击效果,鼠标移动,滚动条滚动,上拉加载
案例:轮播图完成切换需要1s,不加节流,快速点击,嗖嗖的切换 ;加了节流,不管快速点击多少次,1s内只执行一次
上拉加载时添加节流阀
data中定义isLoading节流阀
请求数据前打开节流阀,请求数据后关闭节流阀
再一次请求数据时,判断节流阀的状态,不再请求 ‘
防抖
多次触发事件,只执行一次
比如说在做搜索功能时,如果不做防抖功能,那么每当我们输入一个字的话就会触发事件,而做了防抖功能,就是在我们输入完毕后触发的事件
实现功能
-
data中定义一个定时器
-
input事件中添加防抖
- 先清除定时器
- 重新启动一个定时器,赋值给data中定义的定时器
- 在定时器内部500毫秒内没有输入事件,就为搜索关键字赋值