vue this.$set()
时间: 2023-10-29 17:00:19 浏览: 107
深入理解vue中的$set
在Vue中,this.$set()是一个用于在响应式对象中添加新属性的方法。它是Vue提供的一种解决方案,用于处理动态添加属性时无法触发响应式更新的问题。
this.$set()的语法如下:
```javascript
this.$set(object, key, value)
```
其中,object 是目标对象,key 是要添加的属性名,value 是要添加的属性值。
使用this.$set()后,Vue会在目标对象上添加新属性,并且确保这个新属性是响应式的,可以触发视图的更新。
例如,我们有一个data属性dataObj:
```javascript
data() {
return {
dataObj: {}
}
}
```
如果我们直接通过赋值方式添加新属性,比如:
```javascript
this.dataObj.newProp = 'new value'
```
这样的话,新添加的属性newProp不会触发视图更新。为了解决这个问题,我们可以使用this.$set()方法:
```javascript
this.$set(this.dataObj, 'newProp', 'new value')
```
这样就能确保新属性newProp是响应式的,可以正确触发视图的更新。
阅读全文