javascript - 如何最好地使用 react 状态?

标签 javascript angular ngrx ngrx-store

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

将更改的数据放入商店的最佳方式是什么?

  • 在 onchange 事件期间发送到商店(减去:大量调度)
  • 在类型之间切换时发送(减去:您需要在按下保存按钮之前以某种方式检查已更改的类型的状态)
  • 或者,一般来说,放置会改变的元素并更好地存储它们以供服务是一种不好的做法吗?


  • 还有一个问题,在reducer中进行计算是否正确。例如,我在商店中调度了一个元素列表,我需要为所选类型添加一个新元素。我可以通过服务来做到这一点,但是我需要提取所有元素、所选类型和更多参数,然后执行操作并将更改后的数组放回存储中。或者在具有已知数据的 reducer 中执行所有这些操作。
    或者总的来说,将这个列表保存在商店中是错误的架构方法吗?

    最佳答案

    在不了解用例的情况下,很难对这个问题给出正确答案,因为这完全取决于需求。

    根据经验,如果状态仅影响当前组件,则 ngrx 存储不是存储其数据的地方。这方面的一个例子是表单,将表单与商店中的状态同步通常是一种矫枉过正的做法。话虽如此,如果您需要对表单进行补液,那么保持表单和商店同步是一个很好的用例。

    调度大量 Action 的缺点并不是它的“真正”缺点,恕我直言——ngrx 存储(通常是 redux)旨在处理大量传入 Action 。

    要回答第二个问题,是的,这是 reducer 适用于恕我直言 - 我期待一些逻辑。见 redux docs了解更多信息。

    您还可以在选择器中放置一些“ View 逻辑”,例如过滤、排序、分页......

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

    关于javascript - 如何最好地使用 react 状态?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/58534882/

    相关文章:

    JavaScript : Alert box only once when the user lands

    javascript - 函数返回未定义值,有点迷糊

    css - 如何为 Angular 6 元素全局添加自定义 CSS 文件

    angular - TypeError : _this. handler.handle不是函数错误

    angular - Typescript导入别名+桶文件

    unit-testing - 带有 ngrx 的 angular 2 组件 - 运行单元测试时出错

    javascript - 从 ng-template 访问范围

    javascript - 如何获取对象的匹配对象数组和json对象

    node.js - Angular 2-Angular cli --构建项目

    angular - 如何保持 ngrx 干燥?