vuex store index.js配置登錄

import Vue from 'vue';
import Vuex from 'vuex';

Vue.use(Vuex);
// 初始化時用sessionStore.getItem('token'),這樣子刷新頁面就無需重新登錄
const state = {
	user: window.sessionStorage.getItem('user'),
    token: window.sessionStorage.getItem('token'),
	btns:window.sessionStorage.getItem('btns'),
	identity: window.sessionStorage.getItem('identity')
};
const mutations = {
	//將token保存到sessionStorage里，token表示登陸狀態
	SET_TOKEN: (state, data) => {
		state.token = data;
		window.sessionStorage.setItem('token', data);
	},
	//獲取用戶名
	GET_USER: (state, data) => {
		// 把用戶名存起來
		state.user = data;
		window.sessionStorage.setItem('user', data);
	},
	BTNS: (state, data) => {
		state.btns = data;
		window.sessionStorage.setItem('btns', data);
	},
	//登出
	LOGOUT: state => {
		// 登出的時候要清除token
		state.token = null;
		state.user = null;
		window.sessionStorage.removeItem('token');
		window.sessionStorage.removeItem('user');
	},
	//獲取用戶名
	IDEN: (state, data) => {
		// 把用戶名存起來
		state.identity = data;
		window.sessionStorage.setItem('identity', data);
	},
};

const actions = {};
export default new Vuex.Store({
	state,
	mutations,
	actions,
});

// router index.js登錄攔截

// 注冊全局鈎子用來攔截導航
router.beforeEach((to, from, next) => {
  const token = store.state.token
  if (to.meta.requireAuth) { // 判斷該路由是否需要登錄權限
    if (token) { // 通過vuex state獲取當前的token是否存在
      next()
    } else {
      console.log('該頁面需要登陸')
      next({
        path: '/login'
        // query: {redirect: to.fullPath} // 將跳轉的路由path作為參數，登錄成功后跳轉到該路由
      })
    }
  } else {
    next()
  }
})
export default router