使用Flux商店

时间:2016-04-02 12:50:11

标签: reactjs flux

我正在开展一个只用很短时间的项目。已经存在很少的通量存储库,它们管理应用程序状态的不同方面并且相对独立。

我有两个问题:

存在的一些商店发出了多种类型的变更事件。这是否表明商店处理过多的无关数据应该在不同的商店中,或者这是通常的情况?

我们需要编写一个React组件,该组件依赖于已经存在的多个存储,并且还需要查询服务器以获取一些特定信息以在页面上呈现,然后它将允许用户修改。因此,在此组件可以呈现之前,它需要确保所有商店包含他们需要的内容并发出操作以填充缺少的任何内容。我的问题是如何处理这个问题。创建一个新的存储来获取组件所需的特定数据并依赖于其他存储(使用通常的flux存储依赖性规则),或让组件知道它直接依赖于哪个特定存储,是否会更好?

1 个答案:

答案 0 :(得分:0)

问题的第一部分:取决于。 Flux不会强迫您遵守严格的规则。例如,Redux仅为一切使用一个商店。我在项目中工作,几乎所有组件都有自己的商店,另一个我们在每个视图中有单个商店处理数据模型和所有其他状态。在不了解您的项目细节(大小,复杂性等)的情况下,我不能推荐其中一个。我可能会根据需要选择对您和您的团队和重构有意义的最小数量的商店(即,当您感觉它处理太多或单个文件包含太多不相关的代码时)。无论什么最适合您的情况,让您最舒适。

对于其他部分:由于您只希望在填充所有商店的数据后呈现组件,因此我将引入新商店来处理服务器数据并使用Dispatcher的SELECT name, SUM(computed_value) TotalPrice, wm_concat( type ) group by name 方法来定义依赖项。如果您选择直接使用存储,则可以使用某种初始状态渲染组件,并在缺少部分的情况下加载微调器或禁用用户编辑,并在获取数据后更新状态以显示其余数据/启用编辑。这需要更多的代码,但可以带来更好的用户体验。同样,这一切都取决于您的需求。