Vue再次加载组件,变量更新导致无法渲染视图
有一个组件,组件data中有一个数组:
data () {
return {
list: [] // 假设该数组的 dep.id = 53
}
}
vue中被监听的对象,在控制台中打印的时候,会有__ob__
: Observer 其中有个dep.id
还不太了解这个dev.id
的具体含义,猜测该id
为对象唯一标识
然后,在methods
中,为list
赋值,大概操作就是 this.list = someData
, 然后视图会自动更新,目前一切正常
问题是,当页面进行跳转,再回到该页时,会发现 list
的dep.id
值更新了,且该值貌似都比较大,基本在1000+,先假设该值是1024
而且,在操作list
时,即上面提到的操作 this.list = someData
, 这里的list
的 dep.id
并不是1024
,而是最初的值 53
,这最终导致的结果就是视图无法更新(猜测这时视图引用的应该是1024
的list
)
目前已经通过在data()
外定义list
,使得重新加载组件时引用的都是同一个对象,但是这里面的歪歪还请大佬们指点一下
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(2)
貌似是因为代码里有闭包,导致变量在组件销毁时没能初始化
重新加载组件,data 恢复到初始值,这有什么问题吗- -