問題一：vue-router的幾種實例方法以及參數傳遞
實例方法：
| 實例方法 | 說明 |
|---|---|
| this.$router.push(location, onComplete?, onAbort?) | 這個方法會向 history 棧添加一個新的記錄，所以，當用戶點擊瀏覽器后退按鈕時，則回到之前的 URL。並且點擊 <router-link :to="...">等同於調用 router.push(...)。 |
| this.$router.replace(location, onComplete?, onAbort?) | 這個方法不會向 history 添加新記錄，而是跟它的方法名一樣 —— 替換掉當前的 history 記錄，所以，當用戶點擊瀏覽器后退按鈕時，並不會回到之前的 URL。 |
| this.$router.go(n) | 這個方法的參數是一個整數，意思是在 history 記錄中向前或者后退多少步，類似 window.history.go(n)。 |
注意：
1、在 2.2.0+，可選的在 router.push 或 router.replace 中提供 onComplete 和 onAbort 回調作為第二個和第三個參數。這些回調將會在導航成功完成 (在所有的異步鈎子被解析之后) 或終止 (導航到相同的路由、或在當前導航完成之前導航到另一個不同的路由) 的時候進行相應的調用。
2、如果目的地和當前路由相同，只有參數發生了改變 (比如從一個用戶資料到另一個 /users/1 -> /users/2)，你需要使用 beforeRouteUpdate 來響應這個變化 (比如抓取用戶信息)。
參數傳遞方式：
vue-router提供了params、query、meta三種頁面間傳遞參數的方式。
示例：
// 字符串，不帶參數 this.$router.push('home') // 對象，不帶參數 this.$router.push({ path: 'home' }) // params（推薦）：命名的路由，params 必須和 name 搭配使用 this.$router.push({ name:'user',params: { userId: 123 }}) // 這里的 params 不生效 this.$router.push({ path:'/user',params: { userId: 123 }}) // query：帶查詢參數，變成 /register?plan=private this.$router.push({ path: 'register', query: { plan: 'private' }}) //meta方式：路由元信息 export default new Router({ routes: [ { path: '/user', name: 'user', component: user, meta:{ title:'個人中心' } } ] }) 在組件中使用：
//通過 $route 對象獲取，注意是route，么有r this.$route.params this.$route.query this.$route.meta 問題二： $route 和 $router 的區別
$route是“路由信息對象”，包括path，params，hash，query，fullPath，matched，name等路由信息參數。$router是“路由實例”對象包括了路由的跳轉方法，鈎子函數等。