vue中，经常要对数组进行一些操作，比如删除某个数据，添加一个数据等。拿下面的例子举例：

<div id="app">
        <ul>
            <li v-for="(item,index) in list" :key="item.id">{{item}}---{{index}}</li>
        </ul>
    </div>
    <script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
    <script>
        let vm = new Vue({
            el: '#app',
            data: {
                list: [
					{id: “1”，text: "hello"},
					{id: “2”，text: "vue"}
				]
            }
        });
    </script>

直接对数组通过控制下标的方式进行操作，比如添加一个数据：

vm.list[2] = {id: "3", text: "world"};

这种方法添加的数据，确实可以将数据添加到数组中，但是不会同步更新到视图中。

1.通过数组的一些方法更新数据

换一种方式就可以将数据同步添加到视图了，如下所示：

vm.list.push({id: "3", text: "world"})；

通过这种方式为数组添加的数据，可以使数据在视图中同步更新。同样的还有其他几种数组方法可以达到修改数组中的数据，视图同步更新的目的。

• pop 删除末项
• push 添加一项
• shift 删除第一项
• unshift 添加第一项
• splice 截取/修改/删除数组元素
• sort 对数组排序
• reverse 取反

练习:修改数组中的第二个元素

vm.list.splice(1,1,{id: "200", text: "vue2.0"})

2.通过修改数组的引用来更新数组

除了用数组的一些方法对数组的值进行操作，还可以通过修改数组的引用来更新数组。
直接对数组进行重新的赋值，改变数据引用的地址。

vm.list = [
				{id: “1”，text: "hello"},
				{id: “200”，text: "vue2.0"}
			]

这样也能对数组的数据和视图进行同步更新。

3.set()方法修改数组元素

Vue.set(vm.list,1,{id: “220”，text: "vue2.2"})
// 或者
vm.$set(vm.list,1,{id: “220”，text: "vue2.2"})

同时，此方法也可以用来更新对象类型的数据。

更新对象类型的数据：

• 改变对象的引用
• set()方法