解决刷新页面数据丢失问题及退出登录清空数据

记录自己遇到的问题，以备查询。

使用VUEX来统一管理数据状态
在APP.vue中加入如下代码，目的是将vuex里的信息保存到sessionStorage里

//任何页面F5刷新都会执行APP.vue中的生命周期函数
//说明：登录登路由为/login
created () {
	//判断当前路由是否是登录路由，
	//如果不是，则认为是在非登录界面刷新，将store中的数据保存到sessionStorage中
	if(this.$router.currentRoute.path != "/login"){
      //在页面加载时读取sessionStorage里的状态信息
      if (sessionStorage.getItem("store") ) {
        this.$store.replaceState(Object.assign({}, 	this.$store.state,JSON.parse(sessionStorage.getItem("store"))))
      }

      //在页面刷新时将vuex里的信息保存到sessionStorage里
      window.addEventListener("beforeunload",()=>{
        sessionStorage.setItem("store",JSON.stringify(this.$store.state))
      })
    }else{
	  //否则清空sessionStorage中的数据
      sessionStorage.clear()
    }
}

值得注意的一点是：
项目中的所有跳转至登录路由时，
不能使用this.$router.push(’/login’)
这种方式跳转，原因是这种方式不会触发APP.vue中的created函数，所以无法清空sessionStorage中的store数据；
window.location.replace("/login")
这种方式;跳转至登录路由时会触发APP.vue中的created函数，达到清空sessionStorage中的store数据的效果