vue中element中的input框配合laod中防抖和节流结合使用(性能优化)
Lodash 中文文档地址:
https://www.lodashjs.com/
<el-input placeholder="请输入内容" v-model="input" clearable class="inp" @input="disshow(input)">
</el-input>
输入文字的时候收集输入信息。但是不需要时时刻刻的收集,就需要考虑到节流。
下载lodash使用节流方法throttle
npm i --save lodash
导入
import _ from "lodash"
使用这个方法
_.throttle(func, [wait=0])
disshow:_.throttle(function(value){
console.log(value);
console.log(this.input);
},3000),
这样的话就实现了节流的效果。
那么,如何设置防抖呢?
有方法:_.debounce(func, [wait=0])
<el-button type="warning" @click="bn1">请求网络</el-button>
bn1:_.debounce(function(){
console.log("我被点击了");
//fetch
},3000),