JavaScript 我们能不能把then()里面应该有的东西带进带参数的方法里调用

Question

处理回调时如何避免在 then() 中重复代码是用户登录注册的vuex模块

    login({ commit }, user) {
        return AuthService.login(user).then(
            user => {
                commit('loginSuccess', user);
                return Promise.resolve(user);
            },
            error => {
                commit('loginFailure');
                return Promise.reject(error);
            }
        );
    },
    register({ commit }, user) {
        return AuthService.register(user).then(
            response => {
                commit('registerSuccess');
                return Promise.resolve(response.data);
            },
            error => {
                commit('registerFailure');
                return Promise.reject(error);
            }
        );
    }

我想用这样的参数创建一个函数，它获取突变名称并处理 promse

function handleCallback(strMutationName1,strMutationName2, response, error) {
    response => {
       commit(strMutationName1, response.data)
       return Promise.resolve(response.data);
    },
    error => {
       commit(strMutationName2);
       return Promise.reject(error)
    }
}
And call previous methods like this 
    login({ commit }, user) {
        return AuthService.login(user).then(
            handleCallback('loginSuccess','loginFailure', response, error)
        );
    },
    register({ commit }, user) {
        return AuthService.register(user).then(
            handleCallback('registerSuccess','registerFailure', response, error)
        );
    }

Answer 1

不，then 有两个参数，因此您需要创建两个函数：

function successCallback(commit, name) {
    return response => {
        commit(name, response)
        return Promise.resolve(response);
    };
}
function failureCallback(commit, name) {
    return error => {
        commit(name)
        return Promise.reject(error);
    };
}

然后像这样称呼他们

login({ commit }, user) {
    return AuthService.login(user).then(successCallback(commit, 'loginSuccess'), failureCallback(commit, 'loginFailure'));
},
register({ commit }, user) {
    return AuthService.register(user).then(successCallback(commit, 'registerSuccess'), failureCallback(commit, 'registerFailure'));
}

要制作单个助手，您应该包装整个 then 回调

function handle(commit, name, promise) {
    return promise.then(successCallback(commit, name+'Success'), failureCallback(commit, name+'Failure');
}

login({ commit }, user) {
    return handle(commit, 'login', AuthService.login(user));
},
register({ commit }, user) {
    return handle(commit, 'register', AuthService.register(user));
}

或在调用中使用扩展语法，return 来自助手的元组：

function handleCallbacks(commit, name) {
    return [successCallback(commit, name+'Success'), failureCallback(commit, name+'Failure')];
}

login({ commit }, user) {
    return AuthService.login(user).then(...handleCallbacks(commit, 'login'));
},
register({ commit }, user) {
    return AuthService.register(user).then(...handleCallbacks(commit, 'register'));
}

JavaScript 我们能不能把then()里面应该有的东西带进带参数的方法里调用

JavaScript can we carry what should be inside then() into method with parameters and call it

javascript

callback

promise

vue.js

vuex