用vuex，项目中需要记录一些状态，来判断页面是否为登录状态和页面是否可被编辑，此时用到了vuex中的store来存储一个状态。

//首先 安装vuexnpm install vuex --save  //新建一个store文件夹，并在里面创建一个index.js文件，并导入import Vue from 'vue'import Vuex from 'vuex'Vue.use(Vuex)const store = new Vuex.Store({    state:{        //id        skillId:'',        //技能状态        checkStatus:''    }})export default store

这里记录了两个值一个是id一个是状态值checkStatus,然后把创建的store在main.js里导入

import store from "./store"//vuex

至此，我们可以在所需要的vue文件中为其赋值

this.$store.state.skillId = '需要记录的id'//技能状态this.$store.state.checkStatus = '需要记录的状态'

赋值后，就可以在需要用到这些id和状态的vue文件中取值

'自己定义的变量名' = this.$store.state.checkStatus

现在，skillId和checkStatus相当于两个全局变量，可以在需要的页面获取值和更改值。但有一个严重的问题就是，在我们刷新页面的时候，vuex数据是重新初始化，无法获取的，导致出现了空值。

但这不是自己想要的结果，所以百度了一圈（ ， ），找到了解决办法。

更改store文件下index文件state的定义

const store = new Vuex.Store({    state:sessionStorage.getItem('state') ? JSON.parse(sessionStorage.getItem('state')): {        //id        skillId:'',        //技能状态        checkStatus:''    }})

以及在App.vue中添加

mounted() {            window.addEventListener('unload', this.saveState)        },        methods: {            saveState() {                sessionStorage.setItem('state', JSON.stringify(this.$store.state))            }        }

也就是说监听unload方法，如果重载页面就把state存入

sessionStorage，然后在需要state的时候从sessionStorage中取值。