Vue使用lodash的debounce实现防抖

一、安装依赖包

npm i --save lodash

二、使用

import _ from 'lodash'
let _this = {}
注意:这里有个this指向问题,需要先获得顶层this域。

 beforeCreate() {
     _this = this
 }

在lodash中提供了debounce函数。
注意:debounce函数的返回值是一个function。

watch: {
	valueNum(val){
		this.getCost(val)
	}
},
methods: {
    getCost: _.debounce(
        (val)=>{
             ExpressApi.getTargetCost(_this.getKey(),val).then(res=>{
                 if(res.code == 200){
                     _this.costData= res.data.cost;
                 }
             }).catch(err=>{
                 _this.$toast.showError(err.message);
             })
   }, 500),
}

你可能感兴趣的:(vue)