项目场景:
项目的某个输入框搜索需要调用后端,然后前端vue需要防抖节流
解决方案:
原代码:
getUserList(query) {
listUserSimple({
companyId: this.dialogForm.companyId,
nameOrAccountFuzzy: query,
}).then((res) => {
this.loginAccountOptions = res;
});
},
增加lodash的防抖后代码:
getUserList: _.debounce(function (query) {
listUserSimple({
companyId: this.dialogForm.companyId,
nameOrAccountFuzzy: query,
}).then((res) => {
this.loginAccountOptions = res;
});
}, DEFAULT_DEBOUNCE_TIME),
注意这里function(query)不能改为(query) => {}箭头函数
如果使用箭头函数会导致this的指向错误