记录Vue中防抖的使用

112 阅读1分钟

啊  最近做了一下代码优化

于是 看到了搜索这里 我频繁的发送请求 so 

本小菜鸡决定尝试处理一下

踩坑 —— 最开始我是自己写的防抖函数,然鹅怎么写都不起作用 

(这里也是因为我调用的时候的问题,这里不能写两个函数包起来)

在小李的帮助下,得知我们的神仙JS插件库 Lodash 有现成的防抖函数呢  debounce

代码案例如下:

<el-input :placeholder='请输入' @input="searchProject"></el-input>

// 引入 debounce 
 improt {debounce} from 'lodash';

// 使用

searchProject: debounce(function() {
    this.init();
}, 500)

这里有几个坑需要注意

  1. 绑定的input函数的使用方式
  2. debounce后面不要用箭头函数,this的指向会有问题