vue router子路由 路由巢狀

2021-10-07 18:00:18 字數 1433 閱讀 6330

定義:子路由,也叫路由巢狀,採用在children後跟路由陣列來實現,陣列裡和其他配置路由基本相同,需要配置path和component,然後在相應部分新增來展現子頁面資訊,相當於嵌入iframe。

="hello"

>

}<

/h1>

<

!-- 新增子路由導航 --

>

導航 :

"/home"

>首頁<

/router-link>

|"/home/one"

>

-子頁面1

<

/router-link>

|"/home/two"

>

-子頁面2

<

/router-link>

<

/p>

<

!-- 子頁面展示部分 --

Vue路由(vue router)03(子路由)

對於單頁面的vue應用,子路由的配置可能是必不可少的,其實vue的子路由配置很簡單。這篇文章是基於上一片文章 路由配置02 的。示例需求,早footer.vue模組中配置子路由 示例檔案footer01.vue和footer02.vue 1.在components資料夾下新建乙個children資料...

vue router 學習2 子路由

實際生活中的應用介面,通常由多層的元件組合而成。同樣地,url 中各段動態路徑也按某種結構對應巢狀的各層元件。借助vue router,使用巢狀路由配置,就可以很簡單地表達這種關係。我們來看這樣的乙個例子 我們首先建立兩個新的元件,當做巢狀路由中的元件,hi1.vue hi2.vue 這兩個元件都是...

基礎 vue router實現子路由

例子一 index.js import vue from vue import router from vue router import helloworld from components helloworld import first from components first import ...