input防抖节流之节流vue实例

节流的应用场景频繁会在input实时搜索展示相应内容,所以为了避免无线向后端发送请求以下是核心代码:

对这个input进行节流看下图

你只需要将this.refreshAll()换成自己要执行的逻辑即可

对于获取监听input的值得话在可以有两种比较合适的方式:1.通过input上添加input事件进行监听  2.通过watch监听绑定v-model的input值如下

重点已经说完,说说我遇到了一些坑如果你写成如下的形式节流会有问题(如下)

或者如下

或者如下:

 

这样都是清除不了定时器的,所以需要注意!

 

这是我踩过的坑,希望可以帮到大家,一起进步!有什么问题可以回复一起讨论!!

 

转载于:https://www.cnblogs.com/chengeping/p/10869358.html

  • 0
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值