Arrays 在react/redux中删除或更新项目时，更改缩减器中的数组

我正在使用react/redux，并且一直在寻找在我的reducer中更新我的文章数组的方法，如果一篇文章被编辑或删除

有没有更简单的方法，而不是创建一个

index

函数来查找您试图删除/更新的帖子的索引，然后使用slice返回更新后的数组的当前状态

到目前为止，我的减速机都是这样，我有点卡住了：

import constants from '../constants';

const initialState = {
  all: [],
  sorted: [],
};

export default (state = initialState, action) => {
  const newState = Object.assign({}, state);

  switch (action.type) {
    case constants.CREATE_OFFER:
      newState[action.payload.id] = action.payload;
      newState.all.unshift(action.payload);
      return newState;

    case constants.GET_OFFERS:
      newState.all = action.payload;
      return newState;

    case constants.GET_OFFER:
      newState[action.payload.id] = action.payload;
      return newState;

    case constants.EDIT_OFFER:
      newState[action.payload.id] = action.payload;
      return newState;

    case constants.DELETE_OFFER:
      newState[action.payload.id] = action.payload;
      return newState;

    case constants.SORT_OFFERS:
      newState.sorted = action.payload;
      return newState;

    default:
      return state;
  }
};

---

我认为，一切都很好，但最好使用es6扩展运算符，您的代码看起来会更清晰

case constants.CREATE_OFFER:
   return {
     ...state,
     all: state.all.concat(action.payload),
    [action.payload.id]: action.payload 
   }

case constants.EDIT_OFFER:
   return {
     ...state,
    [action.payload.id]: action.payload,
    all: state.all.map( item => item.id === action.payload.id?action.payload: item ) 
   }

case constants.DELETE_OFFER:
   const new = {
     ...state,
     all: state.all.filter( item => item.id !== action.payload.id)
   };
   delete new[action.payload.id];

   return new;
 }

---

我认为，一切都很好，但最好使用es6扩展运算符，您的代码看起来会更清晰

case constants.CREATE_OFFER:
   return {
     ...state,
     all: state.all.concat(action.payload),
    [action.payload.id]: action.payload 
   }

case constants.EDIT_OFFER:
   return {
     ...state,
    [action.payload.id]: action.payload,
    all: state.all.map( item => item.id === action.payload.id?action.payload: item ) 
   }

case constants.DELETE_OFFER:
   const new = {
     ...state,
     all: state.all.filter( item => item.id !== action.payload.id)
   };
   delete new[action.payload.id];

   return new;
 }

而不是：

newState[action.payload.id] = action.payload;
      return newState;

您可以使用ES6 sytax：

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

我相信，如果您将对象用作应用程序状态而不是数组，它将很容易更新、删除，您只需使用lodash library的.mapKeys方法以及要从数组中提取的属性（理想情况下为“id”）

这将返回：

{
  '1': { id: 1,
    title: 'Hello!',
  },
  '2': {
    id: 2,
    title: 'World'
  }
}

您可以阅读更多内容，而不是：

newState[action.payload.id] = action.payload;
      return newState;

您可以使用ES6 sytax：

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

我相信，如果您将对象用作应用程序状态而不是数组，它将很容易更新、删除，您只需使用lodash library的.mapKeys方法以及要从数组中提取的属性（理想情况下为“id”）

这将返回：

{
  '1': { id: 1,
    title: 'Hello!',
  },
  '2': {
    id: 2,
    title: 'World'
  }
}

---

您可以阅读更多内容

const newState=Object.assign（{}，state）；const newState=Object.assign（{}，state）；记住制作

EDIT_OFFER

和

DELETE_OFFER

编辑/删除相应的OFFER。另外，

sorted

是

initialState

中的一个数组和

SORT\u offer中的一个offer

（我想你还没有实现吗？）正确@AJP我稍后会实现，我想我已经得到了下面的答案。记住让

EDIT\u offer

和

DELETE\u offer

编辑/删除相应的offer。另外，

sorted

是

initialState

中的一个数组，

SORT\u中的一个offer提供了

（我想你还没有实现吗？）正确@AJP我稍后会实现，我想我得到了下面的答案。对于编辑OFFERS，我如何更改all状态，我认为您没有包括我在

返回{…state}

上收到的

意外标记的错误，它指向第一个
您应该检查您是否支持spread运算符-对于编辑提供，我如何更改所有状态，我认为您没有包括我在
返回{…state}
上收到的
意外令牌的错误，它指向第一个
，您应该检查是否支持扩展运算符-