vue pc端实现防抖的方法,记录一下,留待复用。
安装依赖
cnpm i lodash --save
引用依赖
import debounce from 'lodash/debounce'
使用
// 保存
saveData: debounce(function () {
var that = this
var applyCosts = []
that.applyCosts.forEach((type) => {
var data = {
costName: type.costName,
costCode: type.costCode,
costCount: type.number,
totalPrice: type.totalPrice
}
applyCosts.push(data)
});
var applyBaseInfo = {}
// 校验数据
try {
var check = true
that.applyForms.forEach((type, index) => {
if (type.fieldValue) {
applyBaseInfo[type.id] = type.fieldValue
}
if (!that.$refs[`vform${index}`][0].submitForm('ruleForm')) {
throw new Error("中断循环");
}
});
} catch (e) {
check = false
console.log(e)
}
if (!check) {
return
}
// 证明材料必传校验
try {
var isMust = true
that.businessProveFiles.forEach((type, index) => {
if (!that.$refs[`uploadFile${index}`][0].getIsMust()) {
throw new Error("请上传证明材料");
}
});
} catch (e) {
that.$message.error(e.message);
isMust = false
// console.log(e)
}
if (!isMust) {
return
}
// 校验数据
that.applyForms.forEach((type, index) => {
if (that.$refs[`vform${index}`][0]) {
applyBaseInfo[type.id] = that.$refs[`vform${index}`][0].getFormData() + ''
}
});
var applyFileIds = that.getBusinessProveFilesId() + ''
transactSave({
businessId: that.businessId,
transactManner: that.transactManner,
mailAddress: that.mailAddress,
applyFileIds: applyFileIds,
applyBaseInfo: applyBaseInfo,
applyCosts: applyCosts,
remark: that.remark
}).then((res) => {
if (res.code == 1) {
that.$message({
message: '提交成功',
type: 'success'
});
that.goback()
}
}
)
}, 1000, {'leading': true, 'trailing': false})