Просмотр исходного кода

feat: 用户未登录过,直接打开链接的情况下,用户信息为空,此时显示“登录|注册”。

任一存 3 лет назад
Родитель
Сommit
42dc4f9607
2 измененных файлов с 27 добавлено и 9 удалено
  1. 3 1
      src/Store/index.js
  2. 24 8
      src/components/userInfo.vue

+ 3 - 1
src/Store/index.js

@@ -119,7 +119,9 @@ const store = new Vuex.Store({
         context.commit('SetUserAvatar', userInfo.head)
         context.commit('SetUserNickName', userInfo.nickName)
       } catch (error) {
-        console.log(error)
+        console.log('从storage没有读取到有意义的info,store里用户信息置空。')
+        context.commit('SetUserAvatar', '')
+        context.commit('SetUserNickName', '')
       }
     },
   },

+ 24 - 8
src/components/userInfo.vue

@@ -1,14 +1,22 @@
 <template>
   <div class="user-info">
-    <img class="avatar" :src="userAvatar" alt="" />
-    <div class="nickName">{{userNickName}}</div>
-    <i class="iconfont icon-show_drop-down"></i>
-    <ul class="menu">
-      <li><span @click="onClickPersonalCenter">个人中心</span></li>
-      <li><span class="warn" @click="onClickLogout" >退出登录</span></li>
-    </ul>
+    <template v-if="userAvatar && userNickName">
+      <img class="avatar" :src="userAvatar" alt="" />
+      <div class="nickName">{{userNickName}}</div>
+      <i class="iconfont icon-show_drop-down"></i>
+      <ul class="menu">
+        <li><span @click="onClickPersonalCenter">个人中心</span></li>
+        <li><span class="warn" @click="onClickLogout" >退出登录</span></li>
+      </ul>
+    </template>
+    <template v-else>
+      <div class="loginAndRegis">
+        <span>登录</span>
+        |
+        <span>注册</span>
+      </div>
+    </template>
   </div>
-  <!-- <div data-v-623e3237="" class="loginAndRegis"><span data-v-623e3237="">登录</span>|<span data-v-623e3237="">注册</span></div> -->
 </template>
 
 <script>
@@ -110,5 +118,13 @@ export default {
       }
     }
   }
+  .loginAndRegis {
+    font-size: 14px;
+    color: #323233;
+    span {
+      cursor: pointer;
+      padding: 0 5px;
+    }
+  }
 }
 </style>