道具的更改在HMR中不可见(需要重新加载页面)

Question

我遇到了一个小问题(或者可能是故意的，我只是不知道它应该如何工作(。我有父组件-App.vue

<script setup>
import AboutMe from "./components/AboutMe.vue";
</script>
<template>
<AboutMe username="Andrew" />
</template>

子组件AboutMe.vue

<script setup>
defineProps(["username"]);
</script>
<template>
<div class="container">
<div>Name: {{ username }}</div>
</div>
</template>

现在，当我尝试添加一些道具时：应用程序vue:

<AboutMe username="Andrew" age="30" />

AboutMe.vue

<script setup>
defineProps(["username", "age"]);
</script>
<template>
<div class="container">
<div>Name: {{ username }}</div>
<div>Age: {{ age }}</div>
</div>
</template>

我只看到了"年龄："，需要手动重新加载才能看到"年龄：30"。

• 我使用的是最新的Vite，但在最新的Vue CLI上是一样的
• 不知道为什么，但使用Vitesse框架它工作得很好
• Vue Chrome开发工具将"年龄"显示为属性，而不是道具，直到重新加载
• 尝试但没有成功

提前感谢您的帮助。

Answer 1

这个错误似乎是Evan从3.0.0-beta.11 报告并修复的

3.0.0-β.11(2020-05-11(

错误修复
hmr：始终强制hmr模式下的完整子组件道具更新(1b946c8(