Javascript Vue将属性添加到数据根级别并使其成为反应性的

考虑以下代码：

让myData={ a:1 } const app=新的Vue{ 数据：myData }; 正如Vue docs所说，当我们尝试添加如下属性时，新属性不是被动的：

myData.b=12； console.logapp.b；//未定义 Vue文档建议使用Vue.set：

Vue.setmyData，'b'，12； console.logapp.b；//仍未定义 Vue docs说Vue.set向反应对象添加属性

但是我想在数据的根级别添加b。我不知道如何使b反应

问题很简单：如何创建根级别的属性并使其成为被动的

数据中的属性只有在创建实例时存在时才是被动的。这意味着如果添加新属性，例如：

myData.b = 12;

然后对b的更改将不会触发任何视图更新。如果您知道以后需要一个属性，但它开始时为空或不存在，则需要设置一些初始值。例如：

let myData = { a: 1, b: 0 }
// or,
let myData = { a: 1, b: null }

现在您可以看到对b的更改也显示在UI中：

设myData={a:1，b:0} const app=新的Vue{ el:myApp， 数据：myData } myData.b=12； console.logapp.$data；

---

我在文档中找不到是否可以将属性添加到根级别并使其成为反应性的，但有其他解决方案

让myData={ obj：{ a:1 } } const app=新的Vue{ 数据：myData， 观察：{ obj：{ 汉德尔瓦尔{ 控制台。记录“监视！”，val }, 深：是的 } } }; Vue.setapp.obj，“b”，12 console.logapp.$data 文档清楚地表明您不能添加top

Vue不允许向已创建的实例动态添加新的根级别被动属性

必须向根级别对象添加一个键，以便以后可以对其进行更新

您可以：

使用要更新的默认值创建密钥。这意味着你事先知道钥匙 使用通用键创建空对象，例如dynamicrops，并使用Vue.set在运行时向其添加动态键。

---

我想你正在寻找观察家，例如：@yuri，谢谢。问题很简单：如何创建根级别的属性并使其成为被动的？Vue.set仅在添加到嵌套属性时有效。您的确切用例是什么？@BoussadjraBrahim好奇：我需要知道该用例，以便建议最佳模式谢谢，但您正在向嵌套对象添加属性。因此，仅使用Vue.setapp.obj，'b'，12，它就是被动的。不用看了，谢谢。我知道这很有效，这是一个很好的选择。但我想知道是否可以添加一个名称未知的动态根级属性。显然这是不可能的。