最后一个嵌套路由在挂载包含嵌套路由器的组件时引发错误

问：

我对嵌套路由有奇怪的行为。

我在 homeview 上有一个组件，如有必要，会在其中显示嵌套路由。该组件通过 v-if！

HomeFloater 内部

<transition name="fadepage" mode="out-in" appear key="store.state.kidsGames">
     <HomeFloater v-if="store.state.homeFloter==true" ></HomeFloater>  
</transition>

在 KidsGameView 中

    <router-view  v-slot="{ Component }">  
         <transition name="slidefade" appear mode="out-in" >
           <component :is="Component" class="animated" :key="route.path" />
         </transition>
    </router-view>


 onMounted(() => {

      
      console.log("onMounted");
      router.push( {name:"NestedView1"} );

....

如果我现在浏览此组件中的不同嵌套视图，然后删除这些 parnet 组件，则所有未挂载的钩子都会按预期触发。

但是，如果我现在再次显示这些父组件并希望显示第一个嵌套视图，则会触发最后一个视图的卸载并引发错误。我当然可以拦截这个，但为什么会这样呢？

在打开组件之前，我可以重置路由器中的嵌套路由吗？

如果我不时将 homeView 留在父路由器中，则不会发生这种情况。