首先簡單來說明一下router和router和route的區別
- router為VueRouter實例，想要導航到不同url，則使用router為VueRouter實例，想要導航到不同url，則使用router.push方法
- $route為當前router跳轉對象，里面可以獲取name、path、query、params等
params方式傳參和接收參數
this.$router.push({
name:'xxx'
params:{
id:id
}
})
接收參數:
this.$route.params.id
query方式傳參和接收參數
不過query使用name來引入也可以傳參，使用path也可以
this.$router.push({
path:'/xxx'
query:{
id:id
}
})
接收參數:
this.$route.query.id
params方式和query方式的區別
- query方式生成的url為/xx?id=id，params方式生成的url為xx/id
- params方式需要注意的是需要定義路由信息如：path: '/xx/:id',這樣才能進行攜帶參數跳轉，否則url不會進行變化，並且再次刷新頁面后參數會讀取不到
選擇哪個更好
看場景需求，一般我開發喜歡使用params方式方式，因為path定義，會存在嵌套路由比較復雜且不好維護，而name比較簡潔而且更好維護。