v-model 如何使对象的属性具有反应性？答案

【问题标题】：How v-model make a property of object reactive?v-model 如何使对象的属性具有反应性？
【发布时间】：2020-01-06 21:20:00
【问题描述】：

在我上面的链接中，“components”文件夹中有一个名为 HelloWorld.vue 的文件： inputvalue.bbbb 是在 data 选项中定义的反应数据，但是

奇怪的是inputvalue.cccc 在使用 v-model 输入后会变成反应式，但 inputvalue.cccc 不会对 @input 反应式。

在这个问题（Vue.js bind object properties）中，第一种情况应该是不可能的。

【问题讨论】：

【解决方案1】：

使用v-model 将自动使用$set 设置嵌套属性的值。根据您的示例，这确保它适用于数组索引，以及适用于不存在的对象属性。

如果您不熟悉 $set，请在此处记录：

这部分v-model在Vue中的代码在这里：

在您的示例中，有两个输入使用cccc。正如您所注意到的，如果您编辑使用 v-model 的输入，那么一切正常。但是，如果您首先使用:value/@input 输入，那么即使您随后使用v-model 输入，它也不起作用。有点奇怪的是，行为取决于您首先编辑这两个输入中的哪一个。

原因可见$set的代码：

问题是$set 只会在属性不存在的情况下添加反应性属性。因此，如果您首先使用:value/@input 输入，它将创建一个非反应性cccc 属性，并且一旦创建它就不能使其成为反应性，即使您使用$set。必须先使用 delete 将其删除，然后才能以反应方式重新添加。

【讨论】：