Vuejs 路由只能部分工作。

Question

如果我放置没有 childrens（嵌套）的路由，我的应用程序运行良好，但我刚才尝试嵌套它并将我的路由转换为：in routes.js

import alphabetsPage from './components/views/pages/alphabets.vue'
import dictionaryPage from './components/views/pages/dictionary.vue'
import numbersPage from './components/views/pages/numbers.vue'

import LayoutView from './components/views/Layout.vue'

const routes = [{

  path: '/',
  name: 'Home',
  component: LayoutView,
    children: [{
        path: 'basic',
        name: 'Basic',
        component: alphabetsPage,
          children: [{
            path: 'alphabets',
            name: 'Aphabets',
            component: alphabetsPage           
          },
          {
            path: 'numbers',
            name: 'Numbers',
            component: numbersPage           
          }]
    }]
}]

export default routes

如果我去 / 或点击路线 <router-link to="/basic/alphabets" tag="li"><a>numbers</a></router-link> 我可以看到 alphabetsPage 组件，但是如果我去点击 <router-link to="/basic/numbers" tag="li"><a>numbers</a></router-link> 路线不会工作。我有一个 numbersPage 组件在工作。

这必须来自路由，因为，如果我不使用 children 并且只是将路由中的路径定义为 /basic/numbers 或 /basic/alphabets 它就可以工作。

Answer 1

Children 应该在某处显示。

您的 alphabetsPage 没有在模板中

const alphabetsPage = {
    template: '<div>/basic/alphabets <router-view></router-view></div>'
}

https://jsfiddle.net/6fvL1xwc/

Vuejs 路由只能部分工作。

Vuejs routing working only partially.

vue.js

vue-router

vuejs2