1.登录
当用户登录发起请求,
要把用户的信息存储到vuex,但是vuex的数据刷新了会初始化成初始值,需要利用本地存储
初始值:这里要解释下,如果你给state里的一个 userInfo :1 那么它初始值就是1 刷新了 还是有的,并不是丢失,因为之前我以为它是会没有,那如果你给它为null,那初始值就是null,刷新后会是null, 所有在vuex中 为啥
userInfo是本地获取,因为之前在mutations里已经本地存储了。
getCurrentUser().then((res) => {
this.$store.commit("SET_MENU_LIST", null); //这里应该是清除之前登录用户菜单数据
this.$store.dispatch("setUserInfo", res.data); //请求成功 保存在vuex
this.$router.push("/");
});
2.vuex代码
state: {
userInfo: storage.getItem("userInfo"),
menuList: null,
},
actions: {
setUserInfo({ commit }, data) {
commit("SET_USER_INFO", data);
},
setMenuList({ commit }, data) {
commit("SET_MENU_LIST", data);
},
logout({ commit }) { //退出发送logout(axios)请求,请求成功触发mutations里的退出
logout().then(() => {
commit("LOGOUT");
});
},
},
mutations: {
SET_USER_INFO(state, data) {
state.userInfo = data;
storage.setItem("userInfo", data);
},
SET_MENU_LIST(state, data) {
state.menuList = data;
},
LOGOUT(state) {
state.userInfo = "";
storage.removeItem();
router.push("/login");
},
},
getters: {
userInfo: (state) => {
let info = state.userInfo;
if (info && info.myExpireTime < Date.now()) return null;
return info;},
menuList: (state) => state.menuList,
},
});