javascript - 在动态路由组件上时，VueJS 路由导航不起作用

Question

在我的组件中，我有以下 vue-router 路由，其中​​一个动态事件为 '/event/:id'

    routes: [
        {
            path: '/',
            name: 'Dashboard',
            component: Dashboard
        },
        {
            path: '/events',
            name: 'Events',
            component: Events,
            beforeEnter: requireAuth
        },
        {
            path: '/event/:id',
            name: 'Event details',
            component: EventDetails,
            alias: 'test'
        }
    ]

当我访问如下事件 ID 网址时:http://localhost:8080/event/59f4906d8835582773ef769a一切都很好，事件详细信息页面已加载。但是，如果我尝试从该组件导航到/events 页面，则事件组件不会加载，并且我会停留在同一页面上。

我用来离开页面的链接的格式为 <router-link>像这样:

<router-link to="events">Events</router-link>

Answer 1

您应该添加/在路线路径中。

改变这个 <router-link to="events">Events</router-link>至<router-link to="/events">Events</router-link>

如果您仍然遇到问题，请查看此示例:http://jsfiddle.net/657f3twk/