一般项目都会有一些逻辑需要传递值给另一个页面，那么有的时候就会出现一个问题：用户刷新了页面，诶？数据没了，参数错误。那么今天经过总结，解决了这个问题。我在最新的项目中，通过了一下几种情况进行传值：
1、通过路由传值，params或query
2、通过vuex进行状态管理 $store.state...
3、使用localStorage进行传值
那么，关于刷新页面数据消失原因有两种，一是通过路由params传值，二是vuex传值
一、通过路由params传值
路由传值有两种方式，params和query，params传值刷新页面是要消失的，然而query却不会，两者的区别就在于query会把传递的参数显示在url地址中，就像这样：/adminUser/001001001?jum=001001001211，参数过多的话url地址会变得非常难看，如果你并不在意url地址难看与否，那么你可以不使用params，而是使用query，只是切换个单词而已，这是一种方法（不是最优办法）。
-6-28补充：如果想传入多个参数写法如下：
path: '/adminCun/:jum/:id/:type
还有一种方法，就是在定义路由的时候，给path设定参数，举个例子，一看就懂
export default [{path: '/platform',component: Layout2,children: [{path: '/adminCun/:jum', //这里值用:加参数的写法，jum即为参数，注意一定要用/隔开(多参数传递如上代码↑)name:'platformRecycleAdminCun',meta:{title:'管辖村级详情'},component: resolve => require(['@/view/platform/recycle/admincun'],resolve)}]}]
<template slot-scope="props"><el-button type="text" @click="$router.push({name:'platformRecycleAdminCun',params:{jum:props.row.jgNum}})">{{ props.row.jgName }}</el-button></template>
这样就可以随心所欲的刷新了。
二、还有一种就是使用vuex
页面刷新store.state中的数据消失是不可避免的，那么使用localStorage来避免这个问题。发现问题的时候我就考虑到存数据在localStorage里，但是一个一个数据添加实在是太蠢了。那么就需要一个全局的方法来，将store的数据存储在localStorage里。具体的方法也是百度的很好用，也很方便。
在App.vue中，created初始化生命周期中写入以下方法
//在页面刷新时将vuex里的信息保存到localStorage里window.addEventListener("beforeunload",()=>{localStorage.setItem("messageStore",JSON.stringify(this.$store.state))})//在页面加载时读取localStorage里的状态信息localStorage.getItem("messageStore") && this.$store.replaceState(Object.assign(this.$store.state,JSON.parse(localStorage.getItem("messageStore"))));
replaceState这个方法呢，查了api，就是替换 store 的根状态，然后通过对象赋值assign将localStorage进行赋值
beforeunload这个方法是在页面刷新时触发的，将store中的信息存入localStorage
这样就通过localStorage来避免vuex刷新数据消失的问题了。
以上是路由传参和vuex存值、传值的时候刷新页面数据消失的解决办法。
