vuex 获取状态信息 判断

先在store.js 写上这写代码

import Vue from 'vue'
import Vuex from 'vuex'
Vue.use(Vuex); 
const state = {   //要设置的全局访问的state对象
    currentUser: sessionStorage.getItem('user') ? sessionStorage.getItem('user') : '',  
    //要设置的初始属性值
};
const getters = {   //实时监听state值的变化(最新状态)
    getcurrentUser(state) {  //获取当前登录的用户
        return state.currentUser
    },  
};
const mutations = { 
    setcurrentUser(state, user) {  //同上  
        state.currentUser = user; 
    },
};
const actions = {
    setUser(context, user) {  //自定义触发mutations里函数的方法，context与store 实例具有相同方法和属性  
        context.commit('setcurrentUser',user);
    }, 
};
const store = new Vuex.Store({
    state,
    getters,
    mutations,
    actions,
}); 
export default store;

在登陆的页面 调用登陆的接口成功后 写

this.$store.dispatch('setUser',this.username) ;
sessionStorage.setItem('user', this.$store.getters.getcurrentUser);  

在app.vue 写

mounted(){
	window.addEventListener('beforeunload', this.saveCurrentUser());
},
methods:{
	saveCurrentUser(){
      	sessionStorage.setItem('user', this.$store.state.currentUser);  
    },
}

测试存成功没

alert(this.$store.state.currentUser);

在注销的接口调用成功后写 这里写是为了清除 sessionStorage的缓存信息

sessionStorage.setItem("user", "");