Angular 2 ngrx:如何更新嵌入在我的状态数组的项目之一中的数组?

问题描述 投票:0回答:1

在我的减速器中,我想添加一个位于如下数组中的元素:

JSON结构(通过http服务接收):

{
 "id": "09fabf9a-e532-4d2a-87cc-bd949a0a437f",
 "title": 'my title',
 "itemId": "6d442772-d414-46b1-8aab-a105d2bc3b38",
 "createdOn": "2017-01-12T10:12:22.987Z",
 **"replays": []**
}

所以我想添加(为什么不更新)这个replays数组,它位于reviews数组中。

评论阵列:

[review1,review2,review3...review(n)]

我已经有一个用于管理评论的减速器,但是我将如何使用 replays redux 方式来做到这一点? 谢谢

编辑 1:减速器代码

xport const Reviews: ActionReducer<Array<Review>> = (state: any[] = [], action: Action) => {
    switch (action.type) {
        case GET_REVIEWS:
            return action.payload;
        case ADD_REVIEW:
            return [...state, action.payload];
        case UPDATE_REVIEW:
            let index = state.map(review => review.id).indexOf(action.payload.id);
            return [
                ...state.slice(0, index),
                Object.assign({}, state[index], action.payload),
                ...state.slice(index + 1)
            ];
        case DELETE_REVIEW:
            return state.filter(item => {
                return item.id !== action.payload;
            });
        case ADD_REPLAY:
           return 'HERE I'AM STUCK !'
        default:
            return state;
    }
};
javascript arrays angular redux ngrx
1个回答
16
投票

假设您对

ADD_REPLAY
操作的操作是一个带有评论 ID 和要添加的重播的对象。为了不改变对象(重播和回顾),您必须替换它们。

case ADD_REPLAY:
    let index = state.map(review => review.id).indexOf(action.payload.id);
    return [
        ...state.slice(0, index),
        Object.assign({}, state[index], {
            replays: [...state[index].replays, action.payload.replay]
        }),
        ...state.slice(index + 1)
    ];

有一个很棒的免费视频解释了如何避免 egghead 上的数组突变。

© www.soinside.com 2019 - 2024. All rights reserved.