如何最好地使用反应状态?

时间:2019-10-24 05:49:12

标签: javascript angular ngrx ngrx-store

我有一个很大的组成部分,我将所有有关所选项目的信息以及所有信息存储在store(ngrx)中。 该组件有不同的类型,我可以在它们之间切换并更改有关它们的信息(通过输入)。然后,单击保存按钮,将所有更改发送到服务器。

将更改后的数据存储在商店中的最佳方法是什么?

  • 在onchange事件期间发送到商店(减去:大量调度)
  • 在类型之间进行切换时发送(减号:减号:您需要先按某种方式检查已更改类型的状态,然后再按保存按钮)
  • 或者,通常来说,放置会发生变化的元素并更好地将其存储以供使用是一种不好的做法吗?

另一个问题是,在化简器中进行计算是否正确?例如,我在商店中调度了一个元素列表,并且需要为所选类型添加一个新元素。我可以通过该服务执行此操作,但是随后我需要提取所有元素,所选类型和其他一些参数,然后执行操作并将更改后的数组放回存储中。或使用已知数据在减速器中执行所有这些操作。 还是总的来说,这是将清单保存在商店中的错误架构方法吗?

1 个答案:

答案 0 :(得分:2)

在不知道用例的情况下,很难给出正确的答案,因为这完全取决于需求。

根据经验,如果状态仅影响当前组件,则ngrx存储库不是存储其数据的位置。表单就是一个例子,将表单与商店中的状态同步通常是一个过大的杀伤力。话虽如此,如果您需要对表单进行补水,这是使表单与商店保持同步的好用例。

分派很多动作的缺点不是它的“真正”缺点,而是ngrx存储区(通常是redux)旨在处理很多传入动作。

要回答第二个问题,是的,减速器是为恕我直言的-我在这里期望一些逻辑。有关更多信息,请参见redux docs

您还可以在选择器中放置一些“视图逻辑”,例如过滤,排序,分页等等。

Mike和Brandon在ng-conf上发表了演讲,他们解释了什么应该属于国家,什么不属于国家。演讲提供了有用的见解,Reducing the Boilerplate with NgRx