vue中的this.$set
时间: 2023-06-28 17:13:40 浏览: 166
vue中 this.$set的用法详解
5星 · 资源好评率100%
在 Vue 中,我们可以使用 `this.$set` 方法来更新一个 Vue 实例中的响应式数据。通常,我们可以通过直接给一个对象属性赋值的方式来更新这个属性,但是如果这个属性本来不存在,那么这个属性就不会是响应式的。
例如,考虑下面这个示例:
```
data: {
user: {
name: '张三'
}
}
```
如果我们想要更新 `user` 对象中的 `age` 属性,我们可以这样做:
```
this.user.age = 20
```
但是,如果 `user` 对象中没有 `age` 属性,那么这个属性就不会是响应式的。这时,我们可以使用 `this.$set` 方法来更新这个属性,例如:
```
this.$set(this.user, 'age', 20)
```
这样,即使 `age` 属性在开始时不存在,它也会变成响应式的。需要注意的是,`this.$set` 方法只能用于 Vue 实例中的响应式数据,如果要更新非响应式的数据,可以直接使用普通的 JavaScript 赋值语句。
阅读全文