前景
有个应用场景,是点击标签后,重新请求数据,然后页面重新加载数据,数据类型是Object类型。
遇到的问题是,数据重新请求更新后,页面没有重新加载新的数据。
一开始以为是因为对Object类型数据的直接覆盖导致vue不能监听到数据的更新导致的,使用了$forceUpdate(),没有奏效。
解决
后面想到,数据的更新发生在父组件,要更新的视图是在子组件,这样子在父组件使用$forceUpdate(),子组件没有更新也是正常的。
所以,我们可以给子组件添加一个key,每次更新数据后,都改变一下这个key,这样子组件就会重新加载新的数据了。
代码
<template>
<Child :key="timer" />
</template>
<script>
changeData() {
...
this.timer = new Date().getTime()
}
</script>
结尾
本人菜鸟一个,对vue的掌握不是很深入,对问题的描述可能也不是很恰当,有不足之处,请指正 🙏