javascript - 当我重新加载页面时，我的 vue-router 不会加载组件，但在转换时会加载

Question

应用程序.vue:

<template>
  <div id="app">
    <header-section />
    <router-view class="child-container" />
    <bottom-nav v-if="!isAuthRoute" />
  </div>
</template>

我的router.js:

export default new Router({
    mode: 'history',
    base: process.env.BASE_URL,
    routes: [{
        path: '/',
        name: 'Authenticate',
        component: Authenticate,
    }, {
        path: 'conversations',
        name: 'ConversationsList',
        component: ConversationsList
    }, {
        path: 'conversations/:ConversationId',
        component: ConversationDetail,
        children: [{
            path: '',
            name: 'ConversationDetailHighlights',
            component: ConversationDetailHighlights

        }, {
            path: 'transcript',
            name: 'ConversationDetailFullTranscript',
            component: ConversationDetailFullTranscript

        }]
    }],

    scrollBehavior() {
        return { x: 0, y: 0 }
    }
});

当我单击链接转到 /conversations 时，它加载正常。但是当我直接在浏览器中加载 /conversations 时，它不会加载 ConversationsList 组件:

Answer 1

您是否尝试使用路径:'/conversations'？我很确定只有当路由是 path: '/' 的路由的子级时才会省略斜杠前缀