redux reducer传播运算符在数组上不替换旧状态

时间:2017-05-04 13:56:59

标签: javascript reactjs ecmascript-6 redux

在我的redux reducer中,我正在更新两次专辑列表。我希望第二个列表覆盖提供的第一个列表,但是,这不起作用,并且第二个专辑的第二个调用都添加到第一个调用。

我在下面的扩展运算符中是否有正确的操作?请参阅下面的减速机。

export default (state = [], action) => {

    switch(action.type) {

    case 'GET_ALBUM_NAME_SUCCESS':

        return [
            ...state,
            ...action.albums.map(album => {
                const newAlbum = {...album};
                delete(newAlbum.selections);
                return newAlbum;
            })
        ];

    default:

        return state;
}

1 个答案:

答案 0 :(得分:1)

您不需要在要添加的值上使用扩展运算符,只要您想为状态添加值,

export default (state = [], action) => {

    switch(action.type) {

    case 'GET_ALBUM_NAME_SUCCESS':

        return [
            ...state,
            action.albums.map(album => {
                const newAlbum = {...album};
                delete newAlbum.selections;
                return newAlbum;
            })
        ];

    default:

        return state;
}

但是,如果您只想覆盖以前的状态,则根本不需要扩展运算符。

export default (state = [], action) => {

    switch(action.type) {

    case 'GET_ALBUM_NAME_SUCCESS':

        return [
            action.albums.map(album => {
                const newAlbum = {...album};
                delete newAlbum.selections;
                return newAlbum;
            })
        ];

    default:

        return state;
}