Flux:什么时候应该将状态放入商店?

Flux: when should state be put into a store?

我一直在努力 TodoMVC example in Redux and I noticed something interesting: the application hands CRUD of todo objects off to the store, but handles filter state exclusively by passing constants between components, namely the footer and the list view

这里的经验法则是什么?我明白过滤器状态可能永远不会保存到持久存储中(除了可能作为用户配置文件的一部分),但它也感觉将过滤器状态保持在存储之外有点与通量哲学不一致。为什么不将更新过滤器状态委托给商店?

我会说这归结为用例 + 个人喜好。对于这个简单的应用程序,filter 在具有 parent-child 关系的两个组件之间共享,但在其他任何地方都没有。在这种情况下这当然没问题。

国家福利

小商店

像这样的设置会给您带来 simplified/smaller 家商店的好处。我目前正在使用 Reflux 构建一个应用程序,我的一家商店膨胀了很多,我正在考虑如何分解它或者是否可以删除任何数据。

更少尝试 Re-render 个组件

较小商店(至少在 Reflux 中)的一个额外好处是更少的事件分派,这可能意味着更少的 DOM 渲染(或至少更少的虚拟 DOM 重新计算) .

(保留 Reflux 的注意事项),"easy" 设置商店监听器的方式有助于组件获得 re-rendered 以更改任何 属性,即使该组件只关心 1 或 2。回到我的大型商店问题,此时它包含大约 10 个属性。许多组件都连接到它,并且这 10 个属性中的 1 个是相当不稳定的。这会导致所有侦听器组件比必要更频繁地通过虚拟 DOM。因此,我还定义了很多 shouldComponentUpdate 函数,这些函数在我不需要它们的地方定义。

商店的好处

影响DOM布局

当然,将 filter 作为属性传递给 Footer 的一个缺点是它如何影响 DOM 布局。 IE。 Footer 必须是 MainSection 的 child。这足以让我想把 filter 放入商店,尽管开销很大。

数据对其他组件不可用

IMO,最明显的缺点是 filter 数据在应用程序的其他地方根本不可用。根据您的情况,这可能是加号或减号,但我倾向于认为它通常是减号。