用了很久這個vue-cli到現在連入門都算不了，為了防止忘記還是很有必要記一下隨筆的。

關於vue-cli中的router的使用，，

我將所有頁面都存放在components文件夾下，

灰後通過router文件夾下的index.js來做路由的指向

通過指向，用App.vue來進行對router控制

app.vue

===========

<router-link :to="{name:‘about‘}">About</router-link>

<router-link :to="{name:‘version‘}">Version</router-link>

<router-view/>

router->index.js

===========

import Home from ‘@/components/home‘

import About from ‘@/components/about‘

import Version from ‘@/components/version‘

export default new Router({

routes: [

　　　　 {path: ‘/user/:id‘, component: Home,

　　　　　　children: [

　　　　　　　　{path: ‘about‘, name: ‘about‘, component: About},

　　　　　　　　{path: ‘version‘, name: ‘version‘, component: Version}

　　　　　　]

　　　　}

]

})

components -> home.vue

作為父級的控件，必須帶有router-view命令，否則無法顯示，

===========

<div>

i am home

<router-view></router-view>

</div>

vue-cli的顯示邏輯為：

================================

App.vue [router-view]

　　L home.vue [router-view] --父節點-通過router-view來顯示出子節點

　　　　L about.vue　　--children 顯示的子節點於父節點顯示

　　　　L version.vue　　--children 顯示的子節點於父節點顯示

vue-cli router的使用