Question

我是React＆Redux的初学者，我对在Reducers中操作状态感到困惑。在大多数文章和文档中，我一直看到状态是不可变的，我们绝不应该更新状态。我们应始终在减速器中使用...state或object.assign

但是，在著名的教程（Cory House或其他地方（例如Here on GitHub）中，它们会像下面这样直接更新状态：

var initialState = {
    numberOfAjaxCall: 0
}

const ajaxStatusReducer = (state = initialState.numberOfAjaxCall, action) => {
        if (action.type === AJAX_BEGIN_CALL) {
            return state + 1;
        }

        return state;
}

为什么这些代码的编写方式不像以下？

var initialState = {
        numberOfAjaxCall: 0
    }

const ajaxStatusReducer = (state = initialState, action) => {
    if (action.type === AJAX_BEGIN_CALL) {
    return {
        ...state, 
        numberOfAjaxCall: state.numberOfAjaxCall + 1
        };
    }

return state;
}

我想知道我的代码是否错误。还是我对Redux＆Reducers误解了，或者不了解这些代码的实现方式？

您能帮我启发一下这些编码样式吗？

Answer 1

第一个示例不改变状态-它返回一个新数字。在那种情况下，减速器只负责一个数字。

如果您的状态像您给出的示例中所示：

var initialState = {
    numberOfAjaxCall: 0
}

减速器ajaxStatusReducer仅负责numberOfAjaxCall。您仍然需要为整体状态对象使用另一个reducer，它看起来可能像这样（最简单的选择，还有许多其他可以编写此代码的方式）：

function reducer(state, action) {
    return {
        numberOfAjaxCall: ajaxStatusReducer(state.numberOfAjaxCall, action)
    };
}

在第二个示例中，将这两个减速器组合为一个。两者都是有效的选项，这取决于您通常希望如何编写代码/缩减器。

在Reducer中，我们是否总是必须将状态视为不变的？

1 个答案: