vue中数组的七个响应式方法

起因：

​ 在使用vue实习中，通过数组的索引改变了数组中的值，测试时发现，更改成功了，但是试图无响应。

---

原因：

*通过索引值修改数组元素,不是响应式方法*

// 以下代码，虽然可以正确更改索引为0的那一项，但是视图上并不会相应改变
this.person[0]='adda';

---

解决：

​ vue 中包含一组观察数据变异的方法。

1.push（）：该方法是在数组最后添加数据 假设数组为array

​ this.array.push(‘a’) ==> 在数组array的最后添加一个a

​ this.array.push(‘a’,‘b’,‘c’)==>在数组array的最后添加上三个元素，a，b，c

2.splice () ： 该方法可以实现删除和插入元素，有三个参数，例子： this.array.splice(1,0,‘f’)

第一个参数为：从第几个开始？

第二个参数为：删除几个？

第三个参数为：插入什么参数？

删除元素：第二个参数传入，代表着你要删除几个元素？如果没有传入的话，就删除后面所有的元素

this.array.splice(1,2) 从第一个参数开始，删除俩个参数！ this.array.splice(1),从一个参数开始，删除后面所有的参数！

替换元素：第二个参数表示我们要替换几个元素，后面是用于替换他们的元素

this.array.splice(1,1,‘a’) 从第一个参数开始将下一个元素替换成a；

this.array.splice(1,3,‘a’,‘b’,‘c’)从第一个参数开始将下面的三个元素替换成a,b,c

插入元素：第二个元素传入0，后面写要插入的元素就可以了

this.array.splice(1,0,‘a’)在第一个参数后面插入a

this.array.splice(1,0,‘a’,‘b’,‘c’)在第一个参数后面插入a,b,c

3.pop () : 该方法，删除数组最后一个元素；

this.array.pop();

4.shift () : 该方法，删除数组第一个元素

this.array.shift();

5.unshift () :该方法在数组最前面添加元素，

this.array.unshift(‘加油哟’) 在数组前面添加一个元素：加油哟

this.array.unshift(‘a’,‘b’,‘c’) 在数组前面添加三个元素：a，b，c

6.sort () : 该方法是对数组进行排序的

this.array.sort();

正常排序是如此，那么乱序怎么写呢？

this.array.sort(()=>Math.random()-.5) 就可以实现乱序了

7.reverse () : 该方法是对数组进行反转的

this.array.reverse();