标签：改变 深度克隆 creat 循环对象 写法 直接 settime 没有 val
<div id="app">
<ul >
<li
v-for="(val,key,idx) in list"
>
{{key}}
{{val}}
{{idx}}
</li>
</ul>
</div>
<script>
var app = new Vue({
el: ‘#app‘,
created(){
setTimeout(()=>{
this.listp["1"] = [
0,1,2,3,4,5
]
},1500)
},
data: {
list:{},
current:1
},
methods:{
}
})
</script>
这个例子延迟1.5s之后数据并没有被渲染上dom。
研究了一番，用watch监听 变量 【list】，发现如果不开启【deep:true】 深度监听，watch 也监听不到【list】的改变；
那可能v-for是因为没有深度监听，所以监听不到。
但是也没有找到v-for关于深度监听的设置。
所以直接釜底抽薪，改变写法：
var app = new Vue({
el: ‘#app‘,
created () {
setTimeout(() => {
let old = Object.assign({}, this.list) // 浅克隆this.list
old[‘1‘] = [ 0, 1, 2, 3, 4, 5 ];
this.list = old ; // 直接改变 this.list
}, 1500)
},
data: {
list: {}
},
methods: {}
})
这样写 数据变化以后 页面元素就相应发生改变了。
有大神有更好的办法 ，希望不吝赐教。
vue ，v-for循环对象，不是深度克隆？ 数据改变了但是页面元素没有更新。问题解决
标签：改变 深度克隆 creat 循环对象 写法 直接 settime 没有 val
原文地址：https://www.cnblogs.com/wennice/p/9520207.html
