Redux：在 Reducers 中修改状态，可以接受吗？答案

【问题标题】：Redux: Modifying state in Reducers, is it acceptable?Redux：在 Reducers 中修改状态，可以接受吗？
【发布时间】：2017-02-26 09:53:27
【问题描述】：

在这个示例项目中，我有一个登录表单，并且在验证登录或登录失败的情况下，我有一些等待调度的操作。

这两个动作可能由处理与后端对话的提交事件的动作触发。根据后端的响应，它要么触发验证登录，要么登录失败。

为了在视图层对这些情况做出正确反应，我在状态中有一些布尔值。下面的reducer根据触发器修改这些值的状态。

减速器

import {FAILED_LOGIN, VERIFIED_LOGIN} from './../actions/LoginActions';

const INITIAL_STATE = {
    loginRejected: false,
    loginApproved: false,
    username: null,
    id: null,
    token: null
};

export default function(state = INITIAL_STATE, action) {
    switch (action.type) {
    case FAILED_LOGIN:
        return {
            ...state,
            loginRejected: true
        };
    case VERIFIED_LOGIN:
        return {
            ...state,
            loginRejected: false,
            loginApproved: true,
            username: action.payload.data.email,
            id: action.payload.data._id,
            token: action.payload.headers['x-auth']
        };
    default:
        return state;
    }
}

在 reducer 中像这样改变状态是否被认为是不好的做法？我知道我可以返回我在操作本身中编辑的值，然后像处理用户数据一样在 reducer 中分配返回的值，您认为这是对当前表单的更好做法吗？

【问题讨论】：

状态突变在哪里？
你根本没有改变状态。事实上，这是应该如何处理动作和状态的一个很好的例子。动作只包含相关数据，reducers 只修改需要更改的位，保持状态不变。
我在考虑也许在动作本身而不是减速器中处理这个问题是更好的做法。但似乎这两个选项之间没有区别。
@cinnaroll45 我确实看到了一个不同之处，即如果您在操作中执行此操作，您将发送大量与操作相关的额外信息。在这两个选项中，你所拥有的是更好的做法。
@cinnaroll45 您似乎误解了 action 和 reducer 的用途。动作代表一个命令：“执行此操作，这是能够执行此操作的数据”，而减速器实际上执行此命令，将结果合并到您的状态中。那就是说您的代码看起来不错，这是基于您的第一条评论。

标签： javascript reactjs functional-programming redux immutability

【解决方案1】：

你根本没有改变状态。你这样做的方式完全可以接受。通过写这个

return {
            ...state,
            loginRejected: true
        };

您实际上是在创建一个带有状态的新对象，并在不改变状态的情况下返回新对象。事实上，你的做法是一种最佳实践。

【讨论】：

我在考虑也许在动作本身而不是减速器中处理这个问题是更好的做法。但似乎这两个选项之间没有区别。
是的，你可以在行动中做到这一点，但是reducer的一半目的就没有了，而且你会在不正确的行动中编写很多代码。
reducer 的工作是改变当前状态，然后根据分派的动作返回一个新状态，而不改变你在这里做得很好的当前状态。