使用Vue2.0 router 過程中,會對route 會有混淆,現做筆記記錄
一、$router
VueRouter對象
-
router.push方法,
// 字符串
this.router.push({ path: 'home' })
// 命名的路由
this.router.push({ path: 'detail', query: { did: '123' }})
push方法其實和<router-link :to="...">是等同的。
注意:push方法的跳轉會向 history 棧添加一個新的記錄,當我們點擊瀏覽器的返回按鈕時可以看到之前的頁面。
二、$route
Object對象
- route object ,路由信息對象,表示當前激活的路由的狀態信息,包含了完整路徑、當前 URL 解析得到的信息,還有 URL 匹配到的 route records(路由記錄)
- route object 是 immutable(不可變) 的,每次成功的導航后都會產生一個新的對象
路由信息對象:即
route.path
字符串,對應當前路由的路徑,總是解析為絕對路徑,如 "/foo/bar"。
2.route.query
一個 key/value 對象,表示 URL 查詢參數。
例如,對于路徑 /foo?user=1,則有route.hash**
當前路由的 hash 值 (不帶 #) ,如果沒有 hash 值,則為空字符串。
5.route.matched
數組,包含當前匹配的路徑中所包含的所有片段所對應的配置參數對象。
7.$route.name
當前路徑名字