vue使用防抖 按钮提交

1、首先新建一个debounce.js文件

// 防抖函数
let timeout = null
function debounce(fn, wait) {
    if (timeout !== null) clearTimeout(timeout)
    timeout = setTimeout(fn, wait)
}
export default debounce

 2、导入到组件中使用

        放在哪里就从哪里导入  路劲改一下就可以

import debounce from './debounce.js'

3、在methods里面使用

methods: {
            // 提交数据  这个函数是点击的函数
            save(type, val) {
                this.saveType = type
                this.saveVal = val
            //调用防抖函数
                this.debounceFn()
            },

            debounceFn(){
                //使用导入的防抖函数
                debounce(() => {
                    this.postCustomerDataFn(this.saveType, this.saveVal)
                }, 500)
            },

            //这是业务逻辑可以不用看  换成自己的业务逻辑即可
            async postCustomerDataFn(type, val) {
                let res = await postCustomerData({
                    data_analysis: val.content1,
                    problem_diagnosis: val.content2,
                    optimization_suggestions: val.content3,
                    type: type,
                })
                if (res.code == 200) {
                    this.$message({
                        message: res.msg,
                        type: 'success'
                    });
                } else {
                    this.$message({
                        message: res.msg,
                        type: 'error'
                    });
                }
            },
        },