Vuejs路由仅部分工作。

时间:2017-09-09 18:34:02

标签: vue.js vuejs2 vue-router

我的应用程序工作得很好,如果我放置没有孩子的路线(嵌套)但我现在尝试将其嵌套并将我的路线转换为:WinMain(16)

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/basic/numbers即可。

1 个答案:

答案 0 :(得分:1)

应该在某个地方展示儿童。

您的字母表页面没有模板

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

https://jsfiddle.net/6fvL1xwc/