给vue的数据添加新属性后实时响应失效问题
for(var i in data){//data[i]["isShow"] = true;app.$data.testData.push(data[i]);app.$data.testData[i]["isShow"]= true;//app.$set(app.$data.testData[i],"isShow","true&
·
for(var i in data){
//data[i]["isShow"] = true;
app.$data.testData.push(data[i]);
app.$data.testData[i]["isShow"]= true;
//app.$set(app.$data.testData[i],"isShow","true")
console.log(app.$data.testData);
}
该处代码的属性“isShow”在页面是不会实时响应的，昨天刚遇到这个问题，突然发现页面v-if绑定的“isShow”没响应了，然后开始找原因，定位到问题是当在上面循环中先将isShow属性添加到返回数据data上就不会出现这个问题了，这时候想到肯定使这2个操作导致最后的app.$data.testData不一样，在浏览器打印发现：
在
app.$data.testData.push(data[i]);
app.$data.testData[i]["isShow"]= true;下，isShow属性没有get和set方法
在
data[i]["isShow"] = true;
app.$data.testData.push(data[i]);
下，浏览器打印：
说明属性的响应需要有这2个方法存在。
用$set添加属性方法：
app.$set(app.$data响应.testData[i],"isShow","true") //（data,key,value）
Vue社区为您提供最前沿的新闻资讯和知识内容
更多推荐
0
0- 0
已为社区贡献4条内容
所有评论(0)