Vue.js 嵌套路由vue默认值

我有这个根vue组件

<template>
<router-view></router-view>
</template>

主要组件是一个侧栏和一个内容视图，其中应填充/main子项：

    //Main.vue
    <template>
    <sidebar></sidebar>
    <router-view></router-view>
    </template>

这里的想法是保留一个侧边栏并将其渲染到一边

mainchild1.vue打开/main/mainchild1 mainchild2.vue打开/main/mainchild1 现在，如果url中没有指定路由，我想重定向到main组件/main，但至少要填充mainchild1或mainchild2子视图

这里是我努力的地方，任何帮助/提示都将不胜感激

我试图在/to/main/mainchild1上重定向，但它只是呈现根内容，mainchild1.vue因此删除了侧栏

我仍在学习vue，可能在路由tecnique时遗漏了一些步骤

更新

好的，看来我应该从子元素中删除/了。这样就行了

来决定这是否有帮助或者我应该删除它 谢谢 戴维德

route.js

[
  path: '/', redirect: '/main/mainchild1',
  path: '/main', redirect: '/main/mainchild1', component: 'main.vue', children: [
    { path: '/main/mainchild1', component: mainchild1.vue },
    { path: '/main/mainchild2', component: mainchild2.vue }
  ] 
]

app.vue

<template>
 <sidebar v-if="isLoggedIn"/>
 <router-view></router-view> <!-- components mapped with route '/' or '/main' will render here -->
</template>

main.vue

<template>
 <router-view></router-view> <!-- components mapped with route '/main/mainchild1' or '/main/mainchild2' will render here -->
</template>

---

问题是app.vue在登录页面的情况下不应该有侧栏。在这种情况下，您可以添加v-if指令，该指令的布尔值根据登录状态getter/computed返回true/false。根据此.v-if指令更新代码将防止在用户未登录的情况下在dom上呈现侧边栏。通过从子路由中删除/，子路由将成为相对于父路由的路径&finally forms//，您可以通过从/eg.//启动路径来实现以下解决方案中提出的相同效果。此外，如前所述，您尝试重定向/to/main/mainchild1，但它只是呈现根内容。要按照以下解决方案中的建议解决此问题，可以使用route对象中的redirect key重定向/To/main/mainchild1。

<template>
 <router-view></router-view> <!-- components mapped with route '/main/mainchild1' or '/main/mainchild2' will render here -->
</template>