Question

作为Redux的新手，学习Redux最困难的部分之一是决定Redux中的内容以及本地状态。我已经阅读了大部分文档，但我认为这很难做出决定。

在我的情况下，我最终把所有状态都放到Redux中，因为我优先考虑细粒度控制：时间旅行和从配置文件预加载整个应用程序状态的能力是高优先级的。此外，您还可以使用redux dev工具在一个位置检查应用程序中的所有状态，这很不错。

我喜欢这里提出的想法：https://medium.com/@alexmngn/how-to-use-redux-on-highly-scalable-javascript-applications-4e4b8cb5ef38，它在很大程度上依赖于reducer组合，所以我像这样实现它。

这个想法是这样的;嵌套，存储和封装组件以及使用它的状态，以及状态反映应用程序的文件夹结构。通过这种方式，您的项目和状态结构良好，实际上将状态放在Redux中几乎与使用本地状态一样容易 - 并且看起来值得一点点额外的LOC。

它似乎工作得很好，但我必须说我想知道为什么这么少人似乎建议这样做。

在redux应用程序中，你有很多不同的页面/路由，每个页面/路由具有不同的状态，那么它是否会被视为按页/路由分组状态的有效方法，或者这是某种反模式？

{
  reduxRoute: { /* globally available */ }
  session: { /* globally available */ }
  data: { /* globally available */ }
  scenes: {
    Page1: {
      state1: { /* ui state specifically for this view/page */ }
      state2: { /* ui state specifically for this view/page */ }
      data: { /* data state specifically for this view/page */ }
    },
    Page2: {
      state3: { /* ui state specifically for this view/page */ }
      state4: { /* ui state specifically for this view/page */ }
      otherData: { /* data state specifically for this view/page */ }
    }
  }
}

现在应用程序正在运行，但我不打算在导航到Page2时保持Page1状态 - 当你在给定的页面/视图/场景时，我只想表现得很好。

所以我考虑在Page1的componentDidUnmount生命周期函数中触发RESET_PAGE1_STATE操作（对于所有页面），以解决此问题。

这个问题的原因是你通常会听到人们建议在顶层存储东西，但是某些状态仅与某些页面/视图/场景相关，我想更多地构建它并避免在我的根状态中状态3和状态4的无用的空值，当在Page1上时 - 因此是分组。

有些人可能会说，如果你遇到这种问题，你可能做错了。如果某个状态仅与单个页面/视图/场景相关，则可能会说它属于本地状态 - 但是对于我提到的附加控制（时间旅行并且能够从配置文件预加载整个应用程序） - 当然它是是否有必要将它全部保存在redux中？

希望这是有道理的。感谢。

Answer 1

我不认为对当前页面内容保持无关紧要是一个问题。出于性能原因可能是一个问题，说你有成千上万的记录，但我认为没问题。特别是如果你想支持用户旅程，比如转到上一页。

关于状态应该保留的位置：我倾向于将UI相关数据放在组件中，而Redux的存储中则与逻辑相关。例如，当问卷的当前步骤进入应用程序状态时，控制某些内容的可见性的标志会停留在组件中。

按照文件夹结构

1 个答案: