this.$set添加对象
时间: 2023-10-29 11:55:52 浏览: 36
this.$set方法可以用来向Vue对象的数据中添加属性。使用this.$set(obj, key, value)的方式,可以在给定的对象obj中添加一个新的属性key,并将其值设置为value。这样做的好处是,添加属性后,Vue会为该属性自动创建get和set方法,从而让我们能够观察到该属性的变化并及时更新视图。
举个例子,如果我们有一个Vue实例的data属性如下:
```
data: {
student: {
name: '张三'
}
}
```
然后我们想要给student对象添加一个age属性,可以使用this.$set方法:
```
this.$set(this.student, 'age', 15)
```
这样,student对象就会拥有一个新的属性age,并且Vue会自动更新视图。
相关问题
this.$set修改对象
this.$set方法用于给对象添加属性或修改指定属性的值。通过this.$set(obj, '属性名', '属性值')的方式可以实现对对象的属性进行修改或添加。例如,给一个对象添加属性name并赋值为'李四',可以使用this.$set(obj, 'name', '李四')。同样地,可以使用this.$set(obj, 'age', 18)来追加属性age并赋值为18。最后,通过console.log(obj)可以查看修改后的对象。[1]
Vue.set this.$set
Vue.set() 或者 this.$set() 是 Vue 提供的一种方法,用于在响应式对象上添加一个响应式属性。通常情况下,我们可以直接给一个对象添加属性,但是这样添加的属性是不会具备响应式的特性,即当这个属性的值发生改变时,对应的视图不会自动更新。而使用 Vue.set() 或者 this.$set() 添加的属性,则具有响应式特性。
Vue.set() 的语法如下:
```Vue.set(object, propertyName/index, value)```
其中,object 表示要添加属性的对象,propertyName/index 表示属性名或者索引值,value 表示属性值。
this.$set() 与 Vue.set() 的用法相同,只不过是在组件中使用的方法。
举个例子,假设我们有一个 data 对象:
```
data: {
message: 'Hello World',
list: []
}
```
如果我们想要给 list 数组添加一个响应式属性,可以使用如下代码:
```
this.$set(this.list, 0, 'item');
```
这样,在 list 数组中添加了一个值为 'item' 的元素,并且该元素具有响应式特性。