子路由
子菜單的路由方式纺腊，也叫子路由利职。子路由一般用在一個頁面有他的基礎(chǔ)模版滔灶，然后它下面的頁面都隸屬于這個模版送膳，只是部分改變樣式员魏。
改造App.vue的導(dǎo)航代碼
先改造app.vue的導(dǎo)航代碼，來實現(xiàn)基本的導(dǎo)航功能叠聋。我們用<router-link>標(biāo)簽增加了兩個新的導(dǎo)航鏈接撕阎。
App.vue 導(dǎo)航代碼
再訪問主頁的時候?qū)Ш綑诰桶l(fā)生了變化。多出了兩個導(dǎo)航：Hi1頁面 和 Hi2頁面
修改components/Hi.vue頁面?
把Hi.vue改成一個通用的模板碌补，加入<router-view>標(biāo)簽虏束，給子模板提供插入位置∠谜拢“Hi頁面1” 和 “Hi頁面2” 都相當(dāng)于“Hi頁面”的子頁面镇匀，有點像繼承關(guān)系。
在components目錄下新建兩個組件模板 Hi1.vue 和 Hi2.vue?
新建的模板和Hi.vue沒有太多的差別闷袒，只是改變了data中msg 的值坑律，也就是輸出的結(jié)果不一樣了岩梳。
Hi1.vue
Hi2.vue
修改router/index.js代碼
修改路由配置文件
子路由的寫法是在原有的路由配置下加入children字段囊骤。
children字段后邊跟的是個數(shù)組晃择，數(shù)組里和其他配置路由基本相同，需要配置path和component也物。
需要注意的是宫屠，在配置路由文件前，需要先用import引入Hi1和Hi2滑蚯。
