最近在调试前端的时候,发现新建和编辑的时候,快速点击会造成瞬时调用多次接口的情况,需要在前端进行防抖操作。具体就是在表单点保存的时候,对操作方法进行防抖,使用的是 lodash 中 debounced(防抖动)函数。
<xx-btn type="primary" :size="size" @click.native="handleSubmit">保存</xx-btn> import debounce from "lodash/debounce"; ---- handleSubmit: debounce(function (e) { e.preventDefault(); this.form.validateFields((err, values) => { if (!err) { // console.log('处理前的表单数据', values); const queryParams = this.handleParams(values); this.$emit('change', queryParams); } }); }, 2000, { 'leading': true, 'trailing': false }),
参考: