从处于还原器状态的数组中删除第一个元素

Question

我想将最大数组计数保持为10。当新对象被添加到reducer状态时，如果数组计数超过10，我想删除第一个对象。我该怎么做？

这是我的代码：

switch(action.type) {
case types.RECENTLY_VIEWED_ITEM:
return Object.assign({}, state, {
data: [
...(state.data.filter(item => (item.id !== action.payload.id))), 
action.payload
]
});
case types.REMOVE_RECENTLY_VIEWED_ITEM:
return Object.assign({}, state, {
data: [
...(state.data.splice(0, 1))
]});
default:
return state;
}

谢谢

Answer 1

使用slice而不是splice，

splice返回已删除元素的数组，而slice返回删除元素后的数组

case types.REMOVE_RECENTLY_VIEWED_ITEM:
return Object.assign({}, state, {
data: [
...state.data.slice(1, 10)
]});
default:
return state;

不用混合Object.assign和Spread operator，只需使用Spread操作符即可。

case types.REMOVE_RECENTLY_VIEWED_ITEM:
return { ...state, 
data: [
...state.data.slice(1, 10)
]
};
default:
return state;

也可以看到这个答案

在React/Redux中使用Object.assign是一个好做法吗？

Answer 2

用slice更改拼接，您可以这样做：

case types.REMOVE_RECENTLY_VIEWED_ITEM:
return Object.assign({}, state, {
data: [
...(state.data.slice(state.data.length-10, (state.data.length))
]});
default:
return state;