嵌套的 Vue 子路由不会自动加载

Question

我有一个带侧边栏的应用程序。默认情况下，当加载patient/:id时，我想加载Patient视图，默认情况下也应该加载其子视图PatientDashboard。

在Patient视图组件中，我有一个路由器视图，默认情况下它应该加载PatientDashboard-组件。

然而，每次我将页面加载到路由patient/:id时，我都需要在PatientDashboard和Timeline的侧边栏按钮之间来回切换，以加载我的PatientDashboard组件。

那么我如何获得默认子路由加载组件在它的第一次加载?

Patient-Component:

<template>
<div">
<ProfileSidebar :sidebar_elements="sidebar_elements"/>
<div id="profile_content">
<router-view :key="$route.fullPath" />
</div>
</div>
</template>

路由器:

const routes = [
{
path: "/patient/:patient",
name: "Patient",
component: Patient,
props: true,
children: [
{
path: "timeline",
name: "Timeline",
component: Timeline
},
{
path: "",
name: "PatientDashboard",
component: PatientDashboard
},
],
},
]

Answer 1

在主路上添加redirect解决了这个问题:

redirect: {
name: "PatientDashboard"
},