設定子路由

在shop元件中需要實現這種效果

頭部有一個shopheader元件

中間有三個點選路由的地方，點選其中的一個可以切換到相應的路由

建立router資料夾，建立index.js和routes.js

在routes.js註冊路由元件

1/*2

所有路由配置的陣列3*/
45 import shop from '@/pages/shop/shop'
6 import goods from '@/pages/shop/goods'
7 import info from '@/pages/shop/info'
8 import ratings from '@/pages/shop/ratings'
910 export default[11
,19,23
,2731]
32},
3334 ]

1/*2

向外暴露路由器物件模組3*/
4 import vue from 'vue'
5 import vuerouter from 'vue-router'
6 import routes from './routes'78
//宣告使用vue外掛
9vue.use(vuerouter)
1011 export default
newvuerouter()

123

456點餐
789評價
1011
12商家
131415 
1617
18

Vue vue router巢狀路由 子路由

總共新增兩個子路由，分別命名collection.vue 我的收藏 和trace.vue 我的足跡 1 重構router index.js的路由配置，需要使用children陣列來定義子路由，具體如下 import vue from vue import router from vue router...

vue子路由children的使用

前言 上次簡單介紹了vue router，並且建立了兩個路由，如果還沒學過路由基礎知識請點這裡 子路由 比如有一個地址，圈出的地方在about目錄下，可以是childrouter1，也可以是childrouter2，那麼childrouter1 childrouter2就叫做about的子路由 建立...

切換子路由時，父路由的元件會重新渲染

做使用者中心的時候，使用者中心左側顯示使用者頭像和導航欄，點選導航欄會切換子路由 我在父路由元件created呼叫獲取使用者頭像介面，發現每次切換子路由都會呼叫該介面，也就是每次切換子路由，父路由都會重新渲染 home中 也就是渲染父路由的容器。因為設定了key，所以改變路由時，只要key發生變化，...