没有系统学习过vue，以前使用路由传参都是直接this.$router.push({name:‘main’,params:{‘id’: 123}})的，没有在路由定义中配置参数，如下：
复制代码
router:[
{
path:‘/main’,
name:‘main’,
component:Main
}]
// 从index.vue,携带id=123跳到main.vue
this.$router.push({name:‘main’,params:{‘id’:123}}
复制代码
所以一旦页面刷新就会丢失路由传过来的参数了。
解决办法：
1.不修改路由配置，使用sessionStorage来马上缓存(通常在created钩子函数中)获得的路由参数，这种方法要自己把握好什么时候set,什么时候get,什么时候remove。
2.配置路由参数：配置后刷新不会丢失路由传参数
复制代码
router:[
{
path:‘/main/:id’,
name:‘main’,
component:Main
}]
// 从index.vue,携带id=123跳到main.vue
this.$router.push({name:‘main’,params:{‘id’:123}}
复制代码
3.使用query
复制代码
router:[
{
path:‘/main/’,
name:‘main’,
component:Main
}]
// 从index.vue,携带id=123跳到main.vue
this.$router.push({name:‘main’,query:{‘id’:123}}
复制代码
params：/router1/:id ，/router1/123，/router1/789 ,这里的id叫做params
query：/router1?id=123 ,/router1?id=456 ,这里的id叫做query。
当使用params方法传参的时候，要在路由后面加参数名，成为路由的一部分，并且传参的时候，参数名要跟路由后面设置的参数名对应。使用query方法，就没有这种限制，直接在跳转里面用就可以，另外query是拼接在url后面的参数，没有也没关系。
https://blog.csdn.net/bluefish_flying/article/details/81011230
好记性不如烂笔头，每天记录一点点