【问题标题】:Redux Sharing action between reducers vs triggering multiple actionsRedux 在 reducer 之间共享操作与触发多个操作
【发布时间】:2017-10-03 03:05:41
【问题描述】:

例如,如果我有一个登录缩减程序和一个用户图标缩减程序。当我登录时,我想更新用户图标以及存储用户信息。我被困在两个选择之间:

第一个是导出 USER_LOGIN 动作,让登录减速器和用户图标减速器都处理 USER_LOGIN 动作。

第二种方法是在action和reducer之间进行1对1的映射(一种action只属于一个reducer)。我们有登录减速器句柄 USER_LOGIN,然后使用 Saga/Thunk 我们向用户图标减速器发送一个副作用 UPDATE_USER_ICON。

哪个是更好的做法?我个人赞成第二种方法。

【问题讨论】:

  • 我们不要忘记在降级任何答案时添加评论的礼貌。

标签: javascript redux flux


【解决方案1】:

你真的需要在 Redux 中存储用户图标吗?在这种情况下,更好的方法是使用一个选择器,该选择器根据登录用户返回图标。这样你就可以在 store 中保持最少的状态。

您可以使用Reselect 库来缓存选择器。

【讨论】:

    【解决方案2】:

    引用Redux FAQ entry on dispatching multiple actions

    对于您应该如何构建您的操作没有特定的规则。使用像 Redux Thunk 这样的异步中间件当然可以实现诸如连续调度多个不同但相关的动作、调度动作以表示 AJAX 请求的进展、基于状态有条件地调度动作,甚至调度动作并立即检查更新状态等场景之后。

    一般来说,询问这些动作是否相关但独立,或者实际上应该表示为一个动作。做对你自己的情况有意义的事情,但尝试平衡 reducer 的可读性和操作日志的可读性。例如,一个包含全新状态树的操作将使您的减速器成为单线,但缺点是您现在不知道为什么会发生更改,因此调试变得非常困难。另一方面,如果您在循环中发出动作以保持它们的粒度,则表明您可能希望引入一种以不同方式处理的新动作类型。

    尽量避免在您关心性能的地方连续多次同步调度。有许多插件和方法也可以批量调度。

    【讨论】:

      【解决方案3】:

      我会说你的第一种方法更好,这是我常用的方法。是的,当多个 reducer 作用于相同的动作类型时,它可能会影响代码的可读性,但它有助于保持代码不那么冗长(这是我对 React 生态系统的主要抱怨)和一些性能。像登录这样的操作不会对性能产生巨大影响,但是当我对用户操作进行 API 调用时,我只是在多个减速器中处理相同的操作类型。为了便于阅读,我添加了 cmets 和文档。

      【讨论】:

        猜你喜欢
        • 1970-01-01
        • 2023-04-01
        • 2023-03-03
        • 1970-01-01
        • 1970-01-01
        • 2017-11-28
        • 2016-12-15
        • 1970-01-01
        • 2017-07-22
        相关资源
        最近更新 更多