Redux

Question

我正在创建一个 react/redux 应用来为角色扮演游戏制作角色，我希望能够在玩家状态中添加和删除技能。

我目前删除技能的方式是这样的：

const initState = {
    activeSkills: {},
    knowledgeSkills: {},
    skillPointsSpent: 0
}

const skillReducer = (state=initState, action) => {
    var {category, name} = action.parameter

    const actionsToTake = {
        ...//other actions

        DECREMENT_SKILL: () => {
            var newState;

            if(state[category][name].rating === 1) {
                newState = Object.assign(
                    {},
                    state,
                    {
                        skillPointsSpent: state.skillPointsSpent - 1
                    }
                );

                delete newState[category][name];
            }

            return newState
        },

        ...//other actions
    }

    return (actionsToTake[action.type] || actionsToTake.DEFAULT)();
}

我正在减少的状态应该看起来像这样，我正在尝试删除 Archery。所以类别将是 activeSkills，名称将是 Archery

state = {
    activeSkills: {
         Archery: {rating: 1, spec: 'Bow'}
    },
    knowledgeSkills: {},
    skillPointsSpent: 1
}

这显然是错误的做法，因为它改变了我以前的状态。那么从状态对象中删除属性的不可变方法是什么？

Answer 1

编辑

就像 link 中对 @flup 的更新 linked 一样，处理这个问题的更好方法是使用一些对象解构。

if(state[category][name].rating === 1) {
    const { [name]: discard, ...newCategory } = state[category];
    newState = {
        ...state,
        [category]: {
            ...newCategory
        },
        skillPointsSpent: state.skillPointsSpent - 1
    }
}

原创

就像@flup 的回答我需要做的就是复制嵌套更深的对象，然后我可以删除属性而不会改变以前的状态。

if(state[category][name].rating === 1) {
    newState = Object.assign(
        {},
        state,
        {
            [category] : Object.assign(
                {},
                state[category]
            ),
            skillPointsSpent: state.skillPointsSpent - 1
        }
    );

    delete newState[category][name];
}

Redux - 如何从状态中删除道具？

Redux - How to remove a prop from the state?

javascript