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;

您可以只使用Spread运算符，而不是混合Object.assign和Spread operator。

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

    default:
    return state;

也可以看到这个答案

Using Object.assign in React/Redux is a Good Practice?

Answer 2

使用切片更改拼接，您可以这样做：

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

从reducer状态的数组中删除第一个元素

2 个答案: