Redux：处理多个路由之间的状态

Question

我不得不说这是管理应用程序状态的好方法。但是我有几个问题似乎无法在互联网上的任何地方找到答案。

跨多条路线处理您的状态，意思是：

我有我的状态，看起来像这样：

{
    user: {},
    routing: {}
}

我有几个不同的页面，这意味着它添加了（例如）todos，这只在 /todo 路由中很重要。像这样的事情是如何处理的？或者我什至不把它包含在 redux 中。我在想我可以为每条路线添加一个对象，但这很快就会变得混乱。除非这是建议的路线？

我正在寻找正确的 "redux" 答案。我会不会在 Redux 中包含这些值，或者我会只为每条路线创建并在我去的时候嵌套这些值？在这一点上任何事情都有帮助，因为我运行对此一无所知。

谢谢大家！

编辑！

只是回复评论中发生的事情。这是我的状态：

{
  "routing": {
    "changeId": 1,
    "path": "/",
    "state": null,
    "replace": false
  },
  "todos": {
    "visibilityFilter": "SHOW_ALL",
    "todos": [
      {
        "text": "Use Redux - This is the initial state.",
        "completed": false,
        "id": 0
      }
    ]
  },
  "requests": {
    "isFetching": false,
    "data": {}
  }
}

几乎直接从 redux 中提取，路由对象来自 react-router 所以这让我相信我真的不需要这个。但我只是想弄清楚如何保持清洁以及如何为大型应用程序构建我的操作/减速器。

Answer 1

redux 的美妙之处在于 reducer 的可组合性。这意味着您可以在其中存储各种信息，同时完全分开处理它们。这里有一些过于简单和通用的建议。

将所有应用程序状态存储在 Redux 中。这意味着 todos 属性可能存在，但不在需要它的路线上（但可能未填充）。
将路由与数据分离。路由是一种将一堆视图元素捆绑在一起的方法。这些视图元素可能反过来有数据要求，但它们独立于它们出现的任何路线（或路线！）。您商店的形状应该代表您的业务领域。

如果您的应用程序有各种实体，例如待办事项、日历条目和聊天消息，您的 "model" 可能如下所示：

todos:
  todo1:
    name: String
    completed: boolean
  ...
threads:
  thread1:
    participants: [ ... ]
    messages: [ ... ]
  ...
events:
  event:
    date: Date
    todos: [ 'todo1', 'todo2' ]
  ...
users:
  ...
...

我们可能有一个 "todos" 路线，我们专注于待办事项，但这只是我们一些域数据的表示。 TodoList 组件将需要数据并连接到商店以获得它需要的东西。它出现的路线可能会触发请求数据的操作 - 或者它可能完全来自其他地方。浏览到不同的路线会再次启动该过程，但仅针对当时需要的任何数据。

在商店中缓存数据。如果用户从路由 A 单击到路由 B，然后再次返回，则可能不需要服务器调用 re-fetch 所有数据。缓存失效超出了本 post.

Redux：处理多个路由之间的状态

Redux: Handling State between Multiple Routes

reactjs

react-router

redux