vue中路由传参刷新页面后参数丢失的问题

一般的路由传参

this.$router.push({name:'My',params:{id:'123'}})
this.$router.push({path:'/my',query:{id:'123'}})

对于传参过后，跳转到的页面进行刷新行为，参数丢失问题，一般有下面几种方法

1. 用query传参，query类似于get传参，参数会在url中显示，例如：

this.$router.push({path:'/my',query:{key: []}})

接收参数：

this.$route.query.key

2. params传参，另外需要在定义路由时加上参数的key
   例如：

this.$router.push({name:'My',params:{key:[]}})

接收参数：

this.$route.params.key

还要在定义路由时加一个:key，例如：

{
  path: '/my/:key',
  name: 'My',
  component: My
}

这样实现的效果也是在路由中加了参数，看大家习惯，都可以做到刷新页面参数不丢失
3. 用query传参时，比如传了一个数组，那么在刷新页面后，传过来的数组变成了[object object]
解决方法：在传参的时候将要传递的参数转换成字符串，例如：

this.$router.push({path:'/my',query:{key: JSON.stringify([])}}) //JSON.stringify可以把数组或对象转变成字符串

在接受参数的页面，这样就可以解决这个问题

JSON.parse(this.$route.query.key)