Question

我是redux的新手，并编写了一个前端应用程序，该应用程序保存了一个全局状态，该状态在启动时通过ajax检索，然后在检索到新数据时通过poll / push更新。在导航到每个URL时，有一个调度到一个动作的actor，然后调用一个reducer，用一个viewState的过滤视图覆盖globalState个对象的一部分。例如导航到网址/items/filter/a会将viewState调整为以下内容：

state {
     viewState: {
          items: [{id: 1, value: 'a'}]
     }
     globalState: {
          items: [{id: 1, value: 'a'}, 
                  {id: 2, value: 'b'}, 
                  {id: 3, value: 'c']}
     }
}

在此步骤之后，通过另一个actor调用ReactDOM.render()并使用viewState中的更新值重新渲染所有组件（这不是我的代码直接来自unicorn初学者包）

我想知道a）这是否是构建此类应用程序的合理方法。和b）在应用程序启动时初始化globalState变量然后监听更新的最佳方法是什么（如果具有该id的对象当前在{{1}中，那么可能会更新viewState }}）

Answer 1

我没有使用Redux的经验，因为我们在项目中使用了普通的Flux，但我们有类似的场景，我们的解决方案也适合您的场景。

一般来说，我认为这是分割全球状态的好策略。还有一些库可以执行此操作（例如Facebook Relay），这可能会为您提供此功能以及更多开箱即用的功能。

关于初始状态的渲染，我们所做的是设置所有组件以便很好地处理空数据集，即如果它们没有收到数据（在初始渲染时），它们只渲染空div和装载机。然后，当从服务器检索到所有数据（我们使用承诺使用Q库进行同步）时，我们触发BeginRender动作，这会导致现在填充数据的所有商店触发更改事件。订阅商店的组件接收事件并调用商店方法来检索数据。一旦他们收到新数据，就会更新组件状态，并使用数据重新呈现组件。

反应＆amp; Redux应用程序设计

1 个答案: