js防抖函数返回值问题解决方案

需求：

当我们在使用防抖函数的时候会碰到需要使用传入函数的返回值的问题，所以我们配合promise来实现。

带有返回值的防抖函数：

/**
 * @param {函数} fn
 * @param {防抖时间间隔} wait
 */
//防抖函数
const debounce = () => {
   
    let timer = null;
    const newDebounce = function(fn, wait, ...args) {
   
        return new Promise((resolve, reject) => {
   
            if (timer !== null) {
   
                clearTimeout(timer);
            }
            timer = setTimeout(_ => {
   
                try {
   
                    resolve(fn(...args));
                } catch (e) {
   
                    reject(e);
                }
            }, wait);
        });
    };
    return newDebounce;
};

使用：
在 menuDrag.js中导出方法

//收集promose错误
const toAwait = (promise) => {
   
    return promise.then(data => [null, data]).catch(err => [err, undefined])
}

//移动菜单接口
export const moveBMenu = async (list = []) => {
   
    console.log("入参list", list);
    let data = await toAwait(secapi.secPost(process.env.VUE_APP_URL + 'bMenu/moveBMenu', {
    list }))
    if (data[1] !== undefined) {
   
        console.log("移动菜单接口", data[1])
        return data[1]
    } else {
   
        console.log("%c查询菜单接口", "color:red");
        return []
    }
}

//在页面引用js中的方法
import {
    moveBMenu } from './menuDrag.js';
 data() {
   
        return {
   
            newDebounce: debounce(),
            }
        },
methods: {
   
         //拖拽菜单请求接口
        async changeMoveBMenuList() {
   
        //this.queryList我接口需要的参数对象
            let result = await this.newDebounce(moveBMenu, 500, this.queryList);
            if (result.code === 1) {
   
                this.$message.success('移动菜单成功');
            } else {
   
                this.$message.error('移动菜单失败');
            }
        },

}