Vue 数组部分方法不支持响应式
支持响应式的
- 1.push方法 尾部添加
- 2.pop方法 删除数组最后一个元素
- 3.shift方法 删除数组头部第一个元素
- 4.unshift方法 在数组最前面添加元素
- 5.splice方法 删除 插入 添加元素
- 6.sort方法 排序
- 7.reverse方法 反转
不支持响应式的
- this.arrayData[1]='test' //通过索引去修改、
如果数组里面的元素是对象类型的,那修改元素的里面的属性是会刷新页面的,比如:let arrayData=[{a:'a'},{b:'b'},{c:'c'}]; arrayData[0].a='test';//这样是可以刷新页面的。因为这样是改变了数组元素的内容,而并不是直接改变数组元素。数组存的是对象的引用地址,arrayData[0]={a:'test'}。这样是直接改变对象的
- 对于通过修改数组,页面不会刷新,但是数据是会生效的。
- 如果确实想通过索引来修改数组,并且想让页面刷新的话。
- 有三种方式操作:
- 4.1 this.arrayData.splice(1,1,'test'); //删除索引为1的元素,然后再在此位置添加一个元素‘test’
- 4.2 Vue.set(this.arrayData,索引值,‘修改的值test’)
- 4.3 this.$set(this.arrayData,索引值,‘修改的值test’)
- this.arrayData[1]='test' //通过索引去修改、