1.安装lodash

npm install lodash -S

2.全局引用

//全局导入
import _ from 'lodash'
Vue.prototype._ = _  //全局导入的挂载方式

3.调用

1.html

<div @click="search"></div>

2.methods:

防抖

//不传值        
search: _.debounce(function () {
      console.log(this.aa)
}, 5000)
 
//传值
search: _.debounce(function (index) {
     console.log(index)
}, 2000)

节流

 search: _.throttle(function (index) {
  	console.log(index)
 }, 2000)
如果只像上面那么写的话，两秒内你点击多次，会触发两次，改成下面这样就可以
search: _.throttle(function (index) {
     console.log(index)
 }, 2000, { trailing: false })

节流和防抖 都是为了解决短时间触发事件造成的性能问题

防抖：debounce：在事件被触发n秒后再执行回调，如果在这n秒内又被触发，则重新计时 假设设置防抖两秒，点击一次，在两秒内再点击第二次，就会重新计这两秒，（就像王者里面的回城）相当于两秒内的最后一次点击生效

---

节流：throttle：假设设置节流两秒，在两秒内点击多次，只触发第一次，两秒内点击的其他次数不生效

原文链接：https://blog.csdn.net/Technology_hands/article/details/126684261
参考链接：https://blog.csdn.net/Technology_hands/article/details/126684261