React-不同导航级别的Redux或本地状态

Question

我正在用react native和redux制作一个非常简单的应用程序。 我想知道如何管理状态，尤其是导航。 我知道这是一个高度基于意见的问题，但是我认为这对于我对redux的理解至关重要。 导航结构如下：

                                app                          
                            /    |   \
                  role1View    login   role2View
                 /        \
          formView        logView
          /      \
  formPage1     formPage2

导航中要考虑的事项：

• 有3个顶层视图：登录，role1View和role2View。 根据登录角色选择正确的视图。 也应该可以从子视图导航到这些视图，因此我计划将此路由信息保留在redux中。
• role1View有2个选项卡：formView（默认）和logView。 应该不可能直接导航到这些视图，而只能使用选项卡通过UI导航。 选项卡不会以编程方式更改。
• formPage1（默认）和formPage2是formView选项卡上的子视图。 FormPage2需要将数据保存在formPage1上，但是当更改选项卡时，应该忘记表单数据。
• FormPage1发出一个webRequest，并且可以基于该请求重定向到formPage2。 因此，表单必须显示一个加载程序并跟踪请求状态。 如果在处理请求的过程中更改了制表符，则应放弃该请求。 如果请求状态为redux，则这样做可能会更加困难。

所以问题是，我应该存储在redux还是本地状态

• 路线。 我想我会将主要路线存储在redux中，并将其他路线存储在本地状态中。
• 表格数据。 我正在考虑将其存储到formView的本地状态。
• 表单用户界面状态。 也许在formPage1中处于本地状态？

更新，其他问题：

需要从formPage2向formPage1添加向上导航（左上角的箭头）。 Android工具栏是在较高级别（应用程序）上定义的，并且向上按钮的可见性存储在redux中。 我应该如何/在哪里处理向上按钮单击？

Answer 1

我认为Redux先生本人的回应仍然是此处的最佳做法： https ： //github.com/reactjs/redux/issues/1287#issuecomment-175351978

将React用于短暂状态，该状态对应用程序全局无关紧要，并且不会以复杂的方式进行更改。 例如，在某些UI元素中切换，即表单输入状态。 将Redux用于全局重要的状态或以复杂方式突变的状态。 例如，缓存的用户或后期草稿。

因此，一般而言，如果状态仅与一个父级组件相关，而从那里向下一级或两个级别相关，则最好将其保留在本地。 如果该状态可以被该父组件的兄弟姐妹或应用程序中其他更高级别或其他位置的兄弟姐妹触摸，则可能是Redux的不错选择。

将此与您的应用程序联系起来，我认为您已经有了正确的想法。 尤其是当视图在导航时很好地失去状态时，将状态保留在全局存储中实际上是没有意义的。

路由通常是全球关注的问题，这就是为什么react-router-redux非常流行的原因，以将路由状态保留在redux存储中。 但是，由于您的标签页不应该在全球范围内访问（除非将来可能会更改？），所以将路由状态保留在本地仍然更加干净。