优化TagNav中获取菜单名称的方法及因Token过期后造成的BUG修复

harsima · Apr 18, 2018 · 3098378 · 3098378
1 parent e145f8d
commit 3098378
Show file tree

Hide file tree

Showing 5 changed files with 18 additions and 25 deletions.
diff --git a/src/index.vue b/src/index.vue
@@ -12,8 +12,9 @@ export default {
     beforeMount(){
         // 首次加载/刷新时从Cookie中获取Token
         if (Cookie.get('isLogin')) {
+            console.log("重新登录")
             this.$store.dispatch('auth/relogin')
-        } 
+        }
         // 加载默认语言包
         let defLang = Cookie.get('lang') || this.$i18n.locale
         this.$store.dispatch("loadLang", defLang)

diff --git a/src/page/layout/TagNav.vue b/src/page/layout/TagNav.vue
@@ -3,7 +3,7 @@
         <scroll-bar ref="scrollBar">
             <router-link ref="tag" class="tag-nav-item" :class="isActive(item) ? 'cur' : ''" v-for="(item, index) in tagNavList" 
             :to="item.path" :key="index">
-                {{getTagName(item.path)}}
+                {{item.title}}
                 <span class='el-icon-close' @click.prevent.stop="closeTheTag(item, index)"></span>
             </router-link>
         </scroll-bar>
@@ -39,7 +39,8 @@ export default {
             // 如果需要缓存则必须使用组件自身的name，而不是router的name
             this.$store.commit("tagNav/addTagNav", {
                 name: this.$router.getMatchedComponents()[1].name,
-                path: this.$route.path
+                path: this.$route.path,
+                title: this.$route.meta.name
             })
         },
         isActive(item){
@@ -60,22 +61,6 @@ export default {
                 }
             } 
         },
-        getTagName(path){
-            var res;
-            function loopGetName(list){
-                for( var v of list ){
-                    if(v.path === path) {
-                        res = v.name
-                        return
-                    } else if(v.child){
-                        loopGetName(v.child)
-                    }
-                    
-                }
-            }
-            loopGetName(this.$store.state.auth.permissionList)
-            return res
-        },
         scrollToCurTag(){
             this.$nextTick(() =>{
                 for (let item of this.$refs.tag) {

diff --git a/src/router/index.js b/src/router/index.js
@@ -48,6 +48,7 @@ router.beforeEach((to, from, next) => {
     NProgress.start();
 
     // 判断用户是否处于登录状态
+    // debugger
     if (Auth.isLogin()) {
         // 如果当前处于登录状态，并且跳转地址为login，则自动跳回系统首页
         // 这种情况出现在手动修改地址栏地址时

diff --git a/src/store/modules/auth/index.js b/src/store/modules/auth/index.js
@@ -61,10 +61,19 @@ const actions = {
     },
 
     // 重新登录
-    relogin({commit}){
+    relogin({dispatch, commit, state}){
         return new Promise((resolve) => {
             // 根据Token进行重新登录
-            commit('setToken', Cookies.get('token'))
+            let token = Cookies.get('token')
+            if(!token){
+                // 这里需要根据实际情况确认token刷新协议
+                // 若直接使用时因state.token不存在，将无法获得新的token
+                dispatch("getNewToken").then(() => {
+                    commit('setToken', state.token)
+                })
+            } else {
+                commit('setToken', token)
+            }
             commit('user/setName', decodeURIComponent(Cookies.get('userName')), { root: true })
             resolve()
         })

diff --git a/src/store/modules/tagNav/index.js b/src/store/modules/tagNav/index.js
@@ -11,10 +11,7 @@ const mutations = {
             console.error(`${data.name} 组件出现命名重复，请检查组件中的name字段。当前组件所在的路由地址为：${data.path}`)
             return
         }
-        state.cachedPageList.push({
-            name: data.name,
-            path: data.path
-        })
+        state.cachedPageList.push(data)
         state.cachedPageName.push(data.name)
     },
     removeTagNav(state, data){