解决数据修改,但是视图未更新
在uniapp或者vue中,有时候会遇到数据修改,但实际上视图的数据未更新的情况。例如:直接赋值就不会改变视图。用this.$set()后,就可以更新视图。但是当this.list.time有设置默认值时,不管直接是直接赋值还是用set(),都可以修改视图。emmmmm算了,我鶸,就不追究原因了= =。...
·
例一:
在uniapp或者vue中,有时候会遇到数据修改,但实际上视图的数据未更新的情况。
例如:
直接赋值就不会改变视图。
用this.$set()后,就可以更新视图。
但是当this.list.time有设置默认值时,不管直接是直接赋值还是用set(),都可以修改视图。emmmmm
算了,我鶸,就不追究原因了= =。
例二:
点击整个右侧就勾选
后端未返回这样一个标识字段,所以前端自己let一个
//获取列表数据
getList(){
let list = [...]//后端返回的数据
list.forEach((item,index)=>{
item.check = false //默认给每个列表加一个标识
})
},
//点击操作
btn(item,index){
item.check = true
}
这样操作实际上list里的check值是改变了,但是视图却没改变(即没打钩)
进行修改
//获取列表数据
getList(){
let list = [...]//后端返回的数据
list.forEach((item,index)=>{
this.$set(item,'check',false) //默认给每个列表加一个标识
})
},
//点击操作
btn(item,index){
item.check = true
}
主要是用this.$set()
要在做勾选点击在取消勾选
btn(item,index){
item.check = !item.check
}
数组修改某个下标的数据
let arr = [1,2,3,4,6]
this.$set(arr,1,6)
//console 1,6,3,4,6
更多推荐
已为社区贡献7条内容
所有评论(0)