方法一 : obj[key] = value
let obj ={"name":"tom","age":16}
let key = "id";
let value = 2
obj[key] = value;
console.log(obj)
方法二 : ...展开运算符
var obj1={"vue":300,"jquery":200};
var obj2={"react":500};
var obj3={
...obj1,
...obj2
}
console.log(obj3)
在这里我想要在obj中添加一个数组
但是写成了这样:
var obj2 = {XXX:XXX, ZZZ:ZZZ}
var arrobj = {"arr": [ ] }
var obj = {
...obj2, arrobj
}
出来的结果是
obj ={
XXX:XXX, ZZZ:ZZZ,arrobj :{arr: [ ] }
}
很显然不是我要的结果
于是我改成:
var obj2 = {XXX:XXX, ZZZ:ZZZ}
var arr = [ ]
var obj = {
...obj2, arr
}
结果就是
obj ={
XXX:XXX, ZZZ:ZZZ,arr: [ ]
}
方法三: Object.assign(obj4,obj5,obj6);
let obj4 = {a:"1"};
let obj5 = {b:"2"};
let obj6 = {c:"3"};
Object.assign(obj4,obj5,obj6);
方法四:vue数据驱动前提下响应式的属性添加 可以触发视图更新Vue.set(object, key, value)
解决新增的属性当值发生改变时 本身会更改 但是不会更新到视图中
您还可以使用 vm.$set
实例方法,这也是全局 Vue.set
方法的别名:
this.$set(this.obj,'e',02)