Vue 为data中的空数组动态添加对象

情况是这样的：在data中定义了一个数组list，一个对象obj，如下

data(){
	return {
		list: [],
		obj: {
			name: ‘’,
			age:’’,
			hobby: []
		}
	}
}

在操作动态往list中push obj 的，并使用list循环表单元素。如下

for (let index = 0; index <3; index++) {
       this.list.push(this.obj);
 }

以上的方式在循环中导致v-model一直是相同的，原因是push进数组的都是同一个变量。
数组添加对象并是添加的对象支持双向响应的方法：
使用push：

for (let index = 0; index <3; index++) {
       this.list.push({
	      name: ‘’,
	      age:’’,
	      hobby: []
      ****});
 }

使用splice：

for (let index = 0; index <3; index++) {
       this.list.splice(index, 0, {
		name: ‘’,
		age:’’,
		hobby: []
	});
 }

根本原因在于插入的对象，是否是在data中定义的。

又是一个坑自己的神操作 ╮(╯▽╰)╭