兩個頁面之間的跳轉如果需要傳參（例如需要傳遞當前的id），js里寫 window.location.href="xxxxx?id=xx 就可以了；
但是vue不一樣 需要操作的是路由，需要用到 VueRouter
使用之前首先要了解 $router和$route
$router是一個VueRouter的實例 可以導航到不同的路由里，如下
// 字符串 this.$router.push('/home') // 對象 this.$router.push({ path: '/home' }) // 命名的路由 this.$router.push({ name: 'user', params: { userId: '123' }}) // 帶查詢參數，變成 /register?plan=private this.$router.push({ path: '/register', query: { plan: 'private' }})$route是$router跳轉到的當前一個對象，里面包含當前我們可以獲取的path、query、name 、params等屬性，如下
因此VueRouter 兩種傳參方法，
1.第一種傳參 name 與 params的結合使用 ，
const id = '123' // 假設id為123 // 利用name和params傳參 this.$router.push({ name: 'home', params: { id }}) // -> /home/123 // 也可以直接傳參 this,$router.push({ path: `/home/${id}` }) // -> /home/123 // 這里的 params 不生效，因為path要和query搭配 this.$router.push({ path: '/home', params: { id }}) // -> /home 如果傳參時設置name屬性，則需要在定義路由規則對象時也要設置name，並且path的值需要有/:id，如果沒有/:id，則params傳值一刷新頁面就沒了
// 如果傳參設置name屬性，則需要在定義路由對象規則時也要設置name { path: '/home/:id', name: 'home', component: Home }2.第二種傳參 path 與 query結合使用 ，
const id = '123' // 假設id為123 // 帶查詢參數，變成 /home?id=123 this.$router.push({ path: 'home', query: { id }})
3.跳轉后的頁面取值用法類似，分別是this.$route.params.id和this.$route.query.id就可以得到id值。
總結：query類似於get傳參，params則類似於post，即前者在瀏覽器地址欄中顯示參數，后者則不顯示 ，params傳參一刷新就沒了（如果傳的參數在刷新后依舊存在，需要設置/:id），query傳參刷新參數還存在