Vuex（或者可能只是 JS）在 Actions 和 context/commit 中链接了承诺

Question

我们很难弄清楚上下文（或者特别是 { commit }）是如何在链式承诺中使用转译的 ES6 代码处理的。下面是一个登录操作的示例，该操作先进行身份验证，然后 subscribes 使用RxJS 以流的形式提供给用户。我们需要在整个过程中进行多次修改，但不断出现 commit is not a function 错误。

有没有人知道或有这样的例子，或者任何人都可以提供关于在这种情况下在哪里以及如何处理 context/commit 的任何基本指南 - 例如什么时候可以使用 ES6 与什么时候不可以，and/or 上下文提升或不提升的位置（如果有的话），或者是否有更简单的方法来解决所有这些问题，比如可能将所有内容包装在一个 master promise 中？由于我们需要在 promise 链中的每一步都进行潜在的提交，因此我们看不到其中的一些是如何工作的：

const actions = {
  login ({commit}, creds) { // need to commit here
    commit('toggleLoading')
    api.authenticate({
      strategy: 'local',
      ...creds
    })
    .then(function (result) {
      return api.passport.verifyJWT(result.accessToken)
    })
    .then(function ({commit}, payload) {  //need to commit here
      console.log(commit)
      return api.service('users').get(payload.userId)
      .subscribe(commit('setUser', user)) // need to commit here - but commit is not a function error
    })
    .catch(function ({commit}, error) {
      commit('setErr', `ERROR AUTHENTICATING: {$err.message}`) // need to commit here but commit is not a function error
      commit('toggleLoading')
    })
  }

我们找到的所有示例都非常简单，每个操作仅显示一个提交（或者可能 2 个包含在 if 中）。感谢任何帮助或反馈！

Answer 1

首先，.then 和 .catch 中的回调函数采用单个参数，您编码了两个...但是，commit 来自 login 参数仍在范围内，因此修复起来非常简单

你的代码可以简化如下

const actions = {
    login ({commit}, creds) {
        commit('toggleLoading');
        api.authenticate({strategy: 'local', ...creds})
        .then(result => api.passport.verifyJWT(result.accessToken))
        .then(payload => api.service('users').get(payload.userId).subscribe(commit('setUser', user)))
        .catch(function (error) {
            commit('setErr', `ERROR AUTHENTICATING: ${error.message}`);
            commit('toggleLoading');
        });
    }

注意：.catch 中有 {$err.message}，而我认为应该是 ${error.message}

Vuex（或者可能只是 JS）在 Actions 和 context/commit 中链接了承诺

Vuex (or maybe just JS) chained promises in Actions and context/commit

javascript

vuejs2

es6-promise

vuex