路由传参的几种方式，强制刷新参数是否丢失

1、在路由文件配置参数，强制刷新参数绝对不会丢失

//路由文件
{
path:'/child/:id/:key',
name:'child',
component:Child
}

//跳转传参 id=2 key=33
this.$router.push({path:`/child/${id}/${key}`})
this.router.push({name:'child',params:{id:id,key:key}})

//params接收参数
this.$route.params

//地址栏显示参数
localhost:8080/#/child/2/33

2、路由文件不配置参数

//路由文件
{
path:'/child',
name:'child',
component:Child
}

2.1、通过params传参，刷新页面参数会丢失

//跳转传参 只能name跳转 id=2 key=33
this.router.push({name:'child',params:{id:id,key:key}})

//params接收参数
this.$route.params

//地址栏不显示参数
localhost:8080/#/child

2.2、通过query传参，刷新页面绝大多数情况参数不会丢失，某些情况会丢失

//跳转传参 只能path跳转 id=2 key=33
this.$router.push({path:"/child",query:{id:id,key:key})


//params接收参数
this.$route.query

//地址栏显示参数
localhost:8080/#/child?id=2&&key=33

 此方式参数丢失的两种情况：

1、从 A页面  跳转到  B页面需要携带以下 A页面的参数时，在 B页面 刷新时，就会导致参数消失，解决办法：可以在A页面中点击跳转的时候，在本地存储一下需要携带的参数

 2、如果B页面是A页面的子路由，A页面用了v-if，用query传参数刷新也会丢失参数，要用参数配置在路由上的方式