React Redux Unexpected token，预期“，" [英] React Redux Unexpected token, expected ","

问题描述

我正在将 React 与 react-redux 和 redux-actions 结合使用.

I am using React with react-redux and redux-actions.

我有以下减速器一直在告诉我

I have the following reducer that keeps telling me

意外的令牌，预期的，"

unexpected token, expected ","

但我不知道为什么.

comments.js (reducer):

import { handleActions } from "redux-actions";
import {
  GET_COMMENTS,
  SET_COMMENTS,
  ADD_COMMENT
} from "../constants/actionTypes";

export default handleActions(
  {
    [GET_COMMENTS]: (state, action) => state,
    [ADD_COMMENT]: (state, action) => {
      const comments = {
        ...state.comments,
        action.payload
      };
      return {
        ...state,
        comments
      };
    },
    [SET_COMMENTS]: (state, action) =>
      Boolean(action.payload) ? action.payload : state
  },
  {}
);

引起问题的操作是ADD_COMMENT.我尝试了以下方法:

The action causing trouble is ADD_COMMENT. I have tried it the following ways:

[ADD_COMMENT]: (state, action) => {
  ...state,
  comments: {
    ...state,
    action.payload
  }
}

或

[ADD_COMMENT]: (state, action) => ({
      ...state,
      comments: {
        ...state,
        action.payload
      }
})

以及:

[ADD_COMMENT]: (state, action) => {
  return {
      ...state,
      comments: {
        ...state,
        action.payload
      }
  }
}

我不明白为什么我的代码不正确，我在 atom 中的 linter 说它是操作和有效负载之间的点，但我不确定.

I am unable to see why my code is not correct, my linter in atom is saying its the dot between action and payload but I'm not sure.

动作创建者只返回一种 ADD_COMMENT 类型和单个评论的有效负载，格式如下:

The action creator just returns a type of ADD_COMMENT and payload of the individual comment in the following format:

{
    "id": 3,
    "parent": 1,
    "author": "admin",
    "author_is_staff": true,
    "content": "This is a test comment using the API rather than the Admin page, with author specified, with view changed"
}

推荐答案

您试图在没有键的对象中包含一个变量:

You're trying to include a variable in an object without a key:

// This is fine
const comments = {
  ...state.comments
}

// This is not
const comments = {
  actions.payload
}

// Possible alternative:
const comments = {
  ...state.comments,
  payload: actions.payload
}

// Or if you want to destructure `actions.payload`:
const comments = {
  ...state.comments,
  ...actions.payload
}

这篇关于React Redux Unexpected token，预期“，"的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！