vue2.X的路由

以 / 開頭的嵌套路徑會被看成根路徑。

 

<router-link>

在vue-router1.X中是以<a v-link=""></a>存在的

裏面的參數：

　　to：表明跳轉的目的地，渲染成<a href="">  後面目的地有下面幾種表示法

　　　　to引導（不用解析）     to="/home"  字符串路徑    

　　　　:to引導（須要解析）   :to=" 'home' "     :to="{ path: 'home' }" path路徑         :to="{ name: 'user' }" 具名路徑

　　tag：把默認的a標籤能夠自由指定

　　　　如 tag="li"  ，就是把渲染後的標籤變爲<li></li>          <router-link to="/foo" tag="li">foo</router-link>          -- 渲染結果 -->     <li>foo</li>

　　replace：   設置 replace 屬性的話，導航後不會留下 history 記錄       <router-link :to="{ path: '/abc'}"   replace></router-link>       調用 router.replace() ———>來代替 router.push()

　　append：  設置 append 屬性後，則在當前（相對）路徑前添加基路徑。例如，咱們從 /a 導航到一個相對路徑 b，若是沒有配置 append，則路徑爲 /b，若是配了，則爲 /a/b   <router-link :to="{ path: 'relative/path'}" append></router-link>

　　active-class： 默認值: "router-link-active" 連接激活時使用的 CSS 類名，在全局初始化的時候配置；

    

 

 

js內部寫的編程式導航：

　　router.push () ：   這個方法會向 history 棧添加一個新的記錄，能夠經過瀏覽器自帶的後退，回到以前的url，等於<router-link :to="..."> 

　　router.replace(); 至關於<router-link :to="..." replace> 跟 router.push 很像，惟一的不一樣就是，它不會向 history 添加新記錄，而是跟它的方法名同樣 —— 替換掉當前的 history 記錄。

　　router.go(n)： 其中n表明的整數，至關於window.history.go(n)  router.go(1)至關於router.forward()     router.go(-1) 至關於router.back() 

 

路由信息對象的屬性:    route object 是 不可變的，每次成功的導航後都會產生一個新的對象。

      

　　$route.path  類型: string  字符串，對應當前路由的路徑，老是解析爲絕對路徑，如 "/foo/bar"。

　　$route.params  類型: Object  一個 key/value 對象，包含了 動態片斷 和 全匹配片斷，若是沒有路由參數，就是一個空對象。

　　$route.query  類型: Object 一個 key/value 對象，表示 URL 查詢參數。例如，對於路徑 /foo?user=1，則有 $route.query.user == 1，若是沒有查詢參數，則是個空對象。

　　$route.hash  類型: string  當前路由的 hash 值 (不帶 #) ，若是沒有 hash 值，則爲空字符串。

　　$route.fullPath  類型: string  完成解析後的 URL，包含查詢參數和 hash 的完整路徑。

　　$route.matched  類型: Array  就是new VueRouter({ routes: [] })中的routes的數組

　　$route.name  當前路由的名稱，若是有的話

 

router下面有個app的屬性，是APP.vue中template中的全部，也就是掛接到index中id=「app」的dom