在此还原器中，什么是返回{.. state，}的意思

Question

这是非常简单的博客react-redux应用程序的 reducer_posts.js。

import _ from 'lodash';
import { FETCH_POSTS, FETCH_ONE_POST, DELETE_POST } from '../actions/index';
export default function (state = {}, action) {
  switch (action.type) {
    case DELETE_POST:
      return _.omit(state, action.payload);
    case FETCH_ONE_POST:
      return { ...state, [action.payload.data._id]: action.payload.data };
    case FETCH_POSTS:
      return _.mapKeys(action.payload.data, '_id');
    default:
      return state;
  }
}

_.omit(state, action.payload)正在返回状态，而无需操作。

_.mapKeys(action.payload.data, '_id')创建一个与初始对象相同值的对象，但是新对象具有从 action.payload.data._id

中获取的新键。

，但我不能仅仅得到该代码中的内容，这本语法确实可以：

return {  ...state, [action.payload.data._id]: action.payload.data };

这条代码行有什么作用？什么是...

Answer 1

这条代码行为什么？

基本上有两件事：

1. 通过将所有枚举属性从state复制到{}，将旧状态属性添加到新对象中。这是这里的报价表：

另一种方法是使用提出的对象扩展语法 对于JavaScript的下一个版本，该版本可让您使用vread (...(操作员将枚举属性从一个对象复制到 另一个以更简洁的方式。对象传播操作员是 从概念上类似于ES6数组传播操作员。

2. 创建一个新的计算属性，其键是评估action.payload.data._id的结果，并将其值设置为评估action.payload.data的结果。这是这里的报价：

从ecmascript 2015开始，对象初始化器语法也 支持计算的属性名称。这使您可以表达 在括号[]中，将计算为属性名称。这是 与属性登录语法的括号符号对称， 您可能已经用来阅读和设置属性。

这是纯JS中的示例：

const action = {payload: {data: {_id: 'some'}}};
const oldState = {a: '3'};
const newState = {...oldState, [action.payload.data._id]: action.payload.data}
console.log(newState); // {a: '3', some: {_id: 'some'}}

Answer 2

此行将基于当前状态的所有可用属性创建一个全新的对象，并且仅更新" action.payload.data._id"。参数。

作为一个示例：当将redux用作应用程序状态管理范式时，要通知redux有关状态的任何变化时，应创建一个新的状态对象(还原器输出(，以确保发生了实际状态变化(因此，将重新渲染组件(