Vue组件-如何处理非反应性数据？

Question

我在Vue 2组件中失去了反应性开销最佳实践的踪迹。我需要使用genId（）生成一个一次性字符串，并将其分配给组件的id属性。在那之后继续监视似乎是过分的。

1. :id="myID"是将其插入html id的正确方法吗？

然后在设置源时，将非反应性数据放在哪里？我有3个念头：

1. 将属性myID: genId()添加到data。但是，即使它不会更改，这也不会自动将其添加到监视列表吗？造成开销吗？

2. 我从一年前的答案中读到Vue Forum，发现myID: genId()应该放在created钩中。将挂钩用于此类操作是否是最佳做法？我以为不鼓励使用钩子。

3. 或者我可以将其放入组件methods中，然后直接使用:id="genId()

进行调用

是否有 Vue 方式？

Answer 1

将方法2用于非反应性数据（并且您在页面上多次使用该组件，因为添加更改侦听器的小开销会产生影响。）

created() {
  this.myId = genId()
}

这三种方法的行为有所不同：

方法1：数据
创建数据对象时将调用genId（）并添加更改侦听器。

方法2：创建了钩子
创建组件对象并且不添加更改侦听器时，它将调用genId（）。

方法3：方法
每次重新渲染模板时，都会调用genId（）。每当在视图正在侦听的变量上检测到更改或调用$forceUpdate()时，就会发生这种情况。

Ps。 Vue对象已经具有唯一的ID：this._uid
但这是私有财产，在Vue的未来版本中可能会更改。