Question

我有一个使用redux的React应用，其状态对象如下所示：

{
    personal: { firstName: 'Lance', lastName: 'Uppercut' },
    phones: [
        { id: 1, number: '111-222-3333' },
        { id: 2, number: '444-555-6666' }
    ]
}

假设发生的操作仅更改了personal属性，而没有phones。我是否必须在reducer中复制整个phones数组，还是可以将其指向旧数组，因为它没有变化？

换句话说，可以吗？

return Object.assign({}, state, {
    personal: { firstName: 'Rock', lastName: 'Strongo' },
    phones: state.phones
});

还是我也必须复制数组？

return Object.assign({}, {
    personal: { firstName: 'Rock', lastName: 'Strongo' },
    phones: state.phones.map(p => Object.assign({}, p))
});

这也适用于对象引用。如果phones在这样的嵌套对象中

{
    personal: { firstName: 'Lance', lastName: 'Uppercut' },
    phones: {
        '1': { number: '111-222-3333', areaCode: '619' },
        '2': { number: '444-555-6666', areaCode: '512' }
    }
}

可以使用新的状态对象指向旧对象的引用吗？

Answer 1

最好的方法是创建状态的新副本，并且仅更改要更改的字段，即：

return { ...state, personal: { firstName: 'Rock', lastName: 'Strongo' } });

（这是es6的散布运算符的用法，该运算符返回状态对象的新副本并仅更改personal字段，该字段比旧的Object.assign短且干净）。

Answer 2

您只能更新更改的内容，并且其中包含结构。

由于状态已经包含phones，但尚未包含，您只需要合并更改后的个人：

return Object.assign({}, state, {
    personal: { firstName: 'Rock', lastName: 'Strongo' }
});

或使用object spread：

return {
    ...state,
    personal: { firstName: 'Rock', lastName: 'Strongo' }
};

在React Redux中有指向旧状态对象的指针可以吗？

2 个答案: