vue3子组件数据无法更新
vue3父组件传值,子组件数据无法更新
·
在写vue3代码时,遇到了父组件传值给子组件,但是子组件无法及时刷新数据,父组件数据是异步获取的。
使用了很多方法,froceUpdate(),nextTick之类的方法都试过了没有生效。
所以需要在父组件对子组件进行刷新。
解决思路:
- 利用vue diff算法的特点,更新key,强制使子组件刷新
代码:
//dom
//给需要刷新的子组件加上一个自定义的key
<v-number :num="memoryNum" :fontSize="28" class="number" :key="keyNum"></v-number>
//ts
//所有数据加载完毕之后,更改这个key即可
let keyNum = ref(0);
onMounted(async () => {
await init();
keyNum.value++;
});
更多推荐
已为社区贡献1条内容
所有评论(0)