Vue中编程式导航--传参的方式(query和params)

Vue中编程式导航及传参

query方式传参和接收参数
传参	this.$router.push({
        path:'/groupSuccess'
        query:{
          package_name:name
        }
      })
接收参数：this.$route.query.package_name

params方式传参和接收参数
传参 this.$router.push({
        name:'groupCapitalForm'
        params:{
          package_code:code
        }
      })
接收参数：this.$route.params.package_code

当使用params传参的时候，push里面只能使用name，不能与path配合使用；
params只能用name来引入路由，如果写成path，接收参数页面会是undefined！！！
但name可以与query配合使用。

path–query 传参时会在地址栏中看到拼接的参数内容，相当于get请求；
name–params 传参时看不到参数内容，但浏览器刷新会消失，相当于post请求；

既不想传参时看到参数内容，又不要刷新会消失，可以将要传的参数放到sessionStorage中缓存，在另一个界面再调用缓存中的内容就可以了。

sessionStorage.setItem(‘缓存名称routerParam’,Encrypt(JSON.stringify(routerParam))); 加密routerParam以’routerParam’为别名放在sessionStorage中进行缓存；

this.routeParams = JSON.parse(Decrypt(sessionStorage.getItem(“routerParam”))); 获取sessionStorage中缓存的routerParam信息并进行解密；