$router和$route的區別，路由跳轉方式name 、 path 和傳參方式params 、query的區別

一、$router和$route的區別

$router : 是路由操作對象，只寫對象
$route : 路由信息對象，只讀對象

例子：
//$router操作 路由跳轉

this.$router.push({ name:'hello', params:{ name:'word', age:'11' } })

//$route讀取 路由參數接收

var name = this.$route.params.name;

 

二、路由跳轉方式name 、 path 和傳參方式params 、query的區別

path 和 Name路由跳轉方式，都可以用query傳參
例子：

//Router.js { path: '/hello', name: 'HelloWorld', component: helloPage } 跳轉方式name this.$router.push({ name: 'HelloWorld', query: { id: 12345 } }) 跳轉方式path this.$router.push({ path: '/hello', query: { id: 12345 } }) //獲取路由參數信息方式： {{$route.query.id}

path路由跳轉方式,params傳參會被忽略，只能用name命名的方式跳轉

params傳參，push里面只能是 name:'xxxx',不能是path:'/xxx',因為params只能用name來引入路由，如果這里寫成了path，接收參數頁面會是undefined！！！

另外，二者還有點區別，直白的來說query相當於get請求，頁面跳轉的時候，可以在地址欄看到請求參數，而params相當於post請求，參數不會再地址欄中顯示

注意：params傳參如果路由上面不寫參數，也是可以傳過去的，但不會在url上面顯示出你的參數，並且當你跳到別的頁面或者刷新頁面的時候參數會丟失，要怎么解決？