在 Flux / Redux 中保存什么和不保存什么?

What to save & what not to save in Flux / Redux?

所以我相信有不同的方式使用 Redux,我不确定这到底是个好主意,还是我现在做的是完全错误的。假设我有一个管理学校(类 和学生等)的软件。我现在使用 Redux 的方式如下:

1 我首先会存储应用程序状态:选择了哪个瞳孔,当前激活了哪个视图,选中了哪些复选框。我还会为 preferences 设置一个单独的 reducer——即用户在他或她的首选项设置中选择的内容。例如,软件的语言。

这对我来说似乎与存储应用程序状态的想法不同,因为许多与应用程序状态有关的事情不是首选项,而只是当前选择的内容。这种划分是否有意义,或者您会反对这种划分吗?

2 然后,此外,我还使用 Redux 来保存数据,所以我有点将它用作数据库。就我而言,我会将 json 完全 加载到我的商店中,然后继续使用它。因此,我不仅会在我的 Redux 存储中拥有活跃的瞳孔(这将是应用程序状态),而且(在不同的减速器中)每个瞳孔,然后根据需要,为其他减速器提供活跃的减速器等。

这是不好的做法吗?我应该尝试将其完全外包到 'proper' 数据库中吗?

我可以给你的一个实用技巧是避免将 "current pupil" 数据放在 redux 存储中。相反,只需在商店中收集一组学生,按 id 索引,并根据当前 url 从 redux 商店中获取你的反应组件 select 数据(例如,在 /pupils/345 页上,有您的组件使用用户 345 的数据)。

这并不意味着您需要在 redux 中拥有所有学生的数据。 redux state 是一种数据库,但它只代表您的客户知道的信息。例如。当用户到达页面 /pupils/345 时,如果 redux 中没有瞳孔 345,则触发从服务器获取该数据的操作。

对于当前 UI 状态,要点是将数据保存在一个位置,"single source of truth"。该位置可以是:

  • 当前url(使用react-router):非常适合"which view is active"
  • Redux store:当它影响多个单独的组件时很好,例如当前语言
  • 单个有状态组件的状态(如果状态是一个组件的本地状态并且您不需要 redux 的额外功能和复杂性,则这是一个很好的解决方案)

有篇好文章叫 The 5 Types of React Application State that tries to categorize different kinds of data in your application. It's up to you which of those you decide to put into Redux. Quoting the Redux FAQ on what to put into Redux:

Some common rules of thumb for determing what kind of data should be put into Redux:

  • Do other parts of the application care about this data?
  • Do you need to be able to create further derived data based on this original data?
  • Is the same data being used to drive multiple components?
  • Is there value to you in being able to restore this state to a given point in time (ie, time travel debugging)?
  • Do you want to cache the data (ie, use what's in state if it's already there instead of re-requesting it)?

因此,将获取的数据和本地应用程序状态都存储在 Redux 中是完全没问题的。

当您遵循 normalizing state in your Redux store, Redux itself becomes kind of like a client-side database. My "Practical Redux" tutorial series 的建议做法时,显示了跟踪列表中当前选中的项目以及对当前选中的项目进行编辑的示例。