Vue 踩坑日志 - 有关路由传参的坑

1.有关路由传参

vue中当通过params传过去的参数刷新页面以后会消失，所以可以用query传参。但此时又会出现另一个坑，刷新后数据仍在。但这是针对单个的某个变量的。

如果传入一个对象的话，刷新页面后会变成[object,object]。

那么这个问题是如何产生的呢？

探究一下，发现

router他是一个钩子，刷新页面的时候，钩子还是初始化状态，他的值是通过导航变化后，钩子拦截导航是匹配产生的。

所以说当刷新页面的时候，路由并没有发生变化，也就不存在会给变量赋值。所以，此时会出现赋值失败问题。

（以上为个人理解，如果不对请指正）

问题找出来了，怎么解决呢？

emmm.....

第一种：

首先我们要知道我们在传的这个对象中的变量是否都是我们需要的，或者这个对象中只包括很少的变量

我们就可以，用传单个变量的形式，将他们传过去。（有点废话，但确实是个好办法）

第二种：代码

if(this.$route.query instanceof Object){
var msg =sessionStorage.setItem('item',Json.Stringify(this.$route.query))
if(msg){
this.item = JSON.parse(sessionStorage.getItem('item'))
}
}else{
this.item = JSON.parse(sessionStorage.getItem('item'))

}

解释一下就是 先判断 它的格式是否为对象，如果是就将他储存到sessionStorage中，然后data中创建一个新的对象接受即可

JSON.stringify