vue更新data里面的数据(多维数组,多维对象同样这么解决就是了),页面不更新解决办法
官网描述:向响应式对象中添加一个属性,并确保这个新属性同样是响应式的,且触发视图更新。它必须用于向响应式对象上添加新属性,因为 Vue 无法探测普通的新增属性 (比如 this.myObject.newProperty = ‘hi’)vm.$set( target, propertyName/index, value ){Object | Array} target{string | nu...
·
官网描述:
向响应式对象中添加一个属性,并确保这个新属性同样是响应式的,且触发视图更新。它必须用于向响应式对象上添加新属性,因为 Vue 无法探测普通的新增属性 (比如 this.myObject.newProperty = ‘hi’)
vm.$set( target, propertyName/index, value )
{Object | Array} target
{string | number} propertyName/index
{any} value
这是全局 Vue.set 的别名。
这里直接使用别名 $set 就好了
且看demo:
data(){
return {
list:[
{
id:1,
title:'使用统计',
fid:0,
children:[
{
id:5,
title:'激活人数',
fid:1
},
{
id:6,
title:'评估统计',
fid:1
},
{
id:7,
title:'咨询统计',
fid:1
},
{
id:8,
title:'训练统计',
fid:1
}
]
},
{
id:2,
title:'病情分布',
fid:0,
children:[]
},
{
id:3,
title:'康复效果',
fid:0,
children:[]
},
{
id:4,
title:'统计详情',
fid:0,
children:[]
}
],
curPid:1,
showChildList:[]
}
},
created(){
this.list.map(el=>{
el.showFlag = false; //动态添加的属性
})
},
methods:{
showChild(i){
// this.list[i].showFlag = true; //这里直接修改showFlag页面就不刷新
let tmpObj = JSON.parse(JSON.stringify(this.list[i]));
tmpObj.showFlag = true;
this.$set(this.list,i,tmpObj); //这样设置页面就刷新了
}
}
更多推荐
已为社区贡献19条内容
所有评论(0)