教育行業(yè)A股IPO第一股（股票代碼 003032）

全國咨詢/投訴熱線：400-618-4000

Web前端培訓：嵌套路由怎么定義?

更新時間:2022年11月02日16時42分 來源:傳智教育 瀏覽次數(shù):

好口碑IT培訓

　　web前端中，是否是嵌套路由主要是由頁面結(jié)構(gòu)來決定的，實際項目中的應用界面，通常是由多層嵌套的組件組合而成。簡而言之，嵌套路由就是在路由里面嵌套它的子路由。

　　嵌套子路由的關(guān)鍵屬性是children，children也是一組路由，相當于前面講到的routes，children可以像routes一樣地去配置路由數(shù)組。每一個子路由里面可以嵌套多個組件。子組件又有路由導航和路由容器，示例代碼如下：

<router-link to="/父路由地址/要去的子路由"></router-link>

　　當使用children屬性實現(xiàn)子路由時，子路由的path屬性前不要帶“/”，否則會永遠以根路徑開始請求，這樣不方便用戶去理解URL地址。

　　下面我們通過代碼演示一個簡單的嵌套路由的配置，具體代碼如下：

var router = new VueRouter({
    router: [
      {
        path: '/home',
        Component: home,
        children: [
          { path: 'login', component: login },
          { path: 'register', component: register }
        ]
       }
    ]
})

　　在上述代碼中，第3～10行配置的是外層路由，第6～9行配置的是子路由。

0 分享到：
和我們在線交談！