Glimmer.js如何在不使用构造函数的情况下将跟踪属性重置为初始值

Question

在Glimmer.js中，在不使用构造函数的情况下将跟踪的属性重置为初始值的最佳方法是什么？

注意:不能使用构造函数，因为它在初始页面呈现中只被调用一次，而在随后的页面单击时就不再被调用了。

Answer 1

这个答案有两个部分，但它们之间的共同主题是，它们强调从命令式样式(在生命周期挂钩中显式设置值)转换为声明式样式(使用真正的单向数据流和/或使用修饰器来明确表示您正在根据参数对本地状态进行某种转换)。

1. 你确定你需要这么做吗？很多时候，人们认为他们是这样做的，他们实际上应该重组他们的数据流。例如，在Ember中的大部分时间里，人们使用像didInsertElement或didReceiveAttrs这样的钩子来获取“分叉”数据的模式。在微光组件中(无论是在Ember辛烷值还是在独立的Glimmer.js中)，简单地在数据所有者中管理您的更新是习以为常的:真正地执行数据向下操作-向上操作。
2. 偶尔，在组件中创建跟踪数据的本地副本确实是有意义的--例如，当您希望将来自API的数据与表单中的数据处理方式(因为用户界面是API的边界！)分离开来时。在这些场景中，来自@localCopy和@trackedReset的履带工具箱装饰器是很好的解决方案。

- `@localCopy` does roughly what its name suggests. It creates a local copy of data passed in via arguments, which you can change _locally_ via actions, but which also switches back to the argument if the argument value changes.

- `@trackedReset` creates some local state which _resets_ when an argument updates. Unlike `@localCopy`, the state is _not_ a copy of the argument, it just needs to reset when the argument updates.

与以前的Ember经典方法相比，使用这两种方法都可以获得更多的“声明性”数据流：“分叉”数据是通过装饰器完成的(方法2)，而且大部分时间您根本没有分叉它，因为您只是将更改推回原始数据的所有者(1)。