时间戳

首页 > 解决方案 > React redux 从列表中删除多个对象

redux - React redux 从列表中删除多个对象

问题描述

我刚开始使用 react-redux，到目前为止我很喜欢它。从数组中删除与 groupid 匹配的所有对象时，我遇到了问题。

deleteManyProducts: (state, action) => {
     state.list.map((val, i)=>{
          if(val.groupid === action.payload.groupid) {
                state.list.splice(i,1)
          }   
     })
}

我首先用数组中的 3 个对象对其进行了测试，然后删除了前两个。比我用 4 个对象测试它，它还删除了前两个并留下了最后两个。最后我用 5 个对象进行了测试，它删除了前三个并留下了最后两个。

我检查了几次 groupid 匹配并且它与我使用的所有对象匹配。我也尝试了这段代码，但它根本不起作用：

deleteManyProducts: (state, action) => {
     state.list.filter(val=>val.groupid !== action.payload.groupid)
}

但是，当我再次对剩余的对象发送相同的操作时，它只会删除我选择要删除的那个。我不明白为什么它会这样。

标签： reduxreact-redux

解决方案

filter() 或 map() 方法 - 创建一个新数组

所以你可以做state.list = state.list.filter(...)

但是在 Redux 中你不能发送相同的状态......所以你应该为此使用浅拷贝或深拷贝。

deleteManyProducts: (state, action) => {
     const copy = {...state};
     copy.list = state.list.filter(val=>val.groupid !== action.payload.groupid);
     return copy;
}

推荐阅读