Vue 之数组
1.问题今天用Vue的时候，发现一个问题：array[index].flag = ture对应的视图不发生变化最后多方查寻发现，VUE对数组的直接操作index赋值监测不了也就是说 下面这个代码最好不要在VUE中使用this.arr[index]={...}2.解决方法官网专门提供了这种检查不了属性变化的APIVue.set( object, key, value )参数：
·
1.问题
今天用Vue的时候，发现一个问题：
array[index].flag = ture对应的视图不发生变化
最后多方查寻发现，VUE对数组的直接操作index赋值监测不了
也就是说 下面这个代码最好不要在VUE中使用
this.arr[index]={...}2.解决方法
官网专门提供了这种检查不了属性变化的API
Vue.set( object, key, value )
参数：
{Object} object
{string} key
{any} value
返回值： 设置的值.
用法：
设置对象的属性。如果对象是响应式的，确保属性被创建后也是响应式的，同时触发视图更新。这个方法主要用于避开 Vue 不能检测属性被添加的限制。
注意对象不能是 Vue 实例，或者 Vue 实例的根数据对象使用实例：
this.$set(this.arr,index,value)3.个人简单分析
在操作的过程中发现，没有被监测到的属性都有一个共同的特征，对应的属性没有对应的get,set方法。
我们再想想，VUE所谓的双向绑定是如何实现的呢？我们想一想是不是可以在对应的属性的set方法上做手脚，每一次对属性赋值的时候，都会触发set方法，set方法不就是一个万能的监听器了？
我想，通过$set主要就是对属性添加setter方法，进行监听。当然，我还只是一个刚刚接触的小白，还没有对VUE源码进行分析，这里只是一点小小的分析，希望对入坑的你有点帮助。
CSDN联合极客时间，共同打造面向开发者的精品内容学习社区，助力成长！
更多推荐
2
0- 0
已为社区贡献1条内容
所有评论(0)