vuex 存储模块箭头函数中的语法错误答案

【问题标题】：Syntax error in vuex store module arrow functionvuex 存储模块箭头函数中的语法错误
【发布时间】：2019-02-12 16:50:36
【问题描述】：

我知道箭头函数不应该在 Vue 实例中使用。但在动作中，它们甚至在 vuex 文档中也被使用。

尝试从媒体中使用此示例，但出现语法错误。

模块构建失败：SyntaxError: Unexpected token, expected

  49 |     return ApiService
  50 |       .get('project_list')
> 51 |       .then(({data})) => {
     |                       ^
  52 |         context.commit(SET_PROJECTS, data.projects.results);
  53 |         context.commit(FETCH_END)
  54 |       }

src/store/projects.module 中的代码。此处仅更改了变量名称。所以我对这个语法错误有点困惑。

const actions = {
  [FETCH_PROJECTS] (context, payload) {
    context.commit(FETCH_START)
    return ApiService
      .get('project_list')
      .then(({data})) => {
        context.commit(SET_PROJECTS, data.projects.results);
        context.commit(FETCH_END)
      }
      .catch(({response})) => {
        context.commit(SET_ERROR, response.data.errors)
      }
  },
  [FETCH_A_PROJECT] (context, payload) {
    context.commit(FETCH_START)
    const {project_id} = payload
    return ApiService
      .get(`project_list/${project_id}`)
      .then(({data})) => {
        context.commit(SET_A_PROJECT, data.projects);
        context.commit(FETCH_END)
      })
      .catch(({response})) => {
        context.commit(SET_ERROR, response.data.errors)
      })
  }
}

【问题讨论】：

尝试从.then(({data})) => { 中删除() 并保持.then({data}) => { 一样

标签： vue.js vuex vuex-modules

【解决方案1】：

您过早地关闭了then 方法。像这样去掉一个右括号：

.then(({data}) => {
    context.commit(SET_PROJECTS, data.projects.results);
    context.commit(FETCH_END)
})

【讨论】：