Vue的路由對象

一、路由對象含義

• 一個路由對象（route object）表示當前激活的路由的狀態信息，包含了當前URL解析獲得的信息，還有URL匹配到的路由記錄（route records）。
• 路由對象是不可變的，每次成功的導航都會產生一個新的對象。

二、 路由對象的使用（慢慢熟悉）

• 在組件內，即this.$route;
• 在$route觀察者回調內；
• router.match(location)的返回值;
• 導航守衛的參數：

router.beforeEach((to, from, next) => {
            // to 和 from 都是路由對象
        })

• scrollBehavior方法的參數：

const router = new VueRouter({
            scrollBehavior (to, from, savedPosition){
                // to 和 from 都是路由對象
            }
        })

三、路由對象屬性

• $route.path

string類型，對應當前路由的路徑，老是解析爲絕對路徑，如"/man/tom"；

---

• $route.params

object類型，一個key/value對象，包含了動態片斷和全匹配片斷，若是沒有路由參數，就是空對象；

---

• $route.query

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

---

• $route.hash

string類型，當前路由的hash值（帶#）,若是沒有hash值，則爲空字符串；

---

• $route.fullPath

完整解析後的URL，包含查詢參數和hash的完整路徑；

---

• $route.matched

array<RouteRecord>數組類型，包含當前路由的全部嵌套路徑片斷的路由記錄。路由記錄就是routes配置數組中的對象副本（還有在children數組）；當URL爲/foo/bar, $route.match將會是一個包含從上到下的全部對象（副本）。

const router = new VueRouter({
    routes: [
    // 下面的對象就是路由記錄
        {
            path：'foo',
            component: Foo,
            children: [
                // 這也是一個路由記錄
                {
                    path: 'bar',
                    component: Bar
                }
            ]
        }
    ]
})

---

• $route.name

當前路由的名稱，若是有的話

---

• $route.redirectedFrom

若是存在重定向，即爲重定向來源的路由的名字。

重定向經常用於自動跳轉，從活動空間來看大概分兩類：服務器內部跳轉和服務器之間跳轉。