fix: 修复 v-login-show 逻辑判断问题

Evansy · Oct 13, 2023 · f1ac0c2 · f1ac0c2
1 parent fe4abfb
commit f1ac0c2
Show file tree

Hide file tree

Showing 2 changed files with 14 additions and 7 deletions.
diff --git a/src/directives/v-login-show.ts b/src/directives/v-login-show.ts
@@ -4,11 +4,16 @@ import { watchEffect } from 'vue'
 import { useUserStore } from '@/stores/user'
 
 const vLoginShow: Directive = {
-  mounted(el) {
+  mounted(el: HTMLElement) {
+    let display = ''
     const userStore = useUserStore()
+    // 一开始获取到的 isSign 就是 false 如果用原始的 el.remove 等 isSign 变成 true 的时候 el 可无法创建出来
     watchEffect(() => {
       if (!userStore.isSign) {
-        el?.remove()
+        display = el.style.display
+        el.style.display = 'none'
+      } else {
+        el.style.display = display || 'block'
       }
     })
   },

diff --git a/src/main.ts b/src/main.ts
@@ -21,9 +21,11 @@ const pinia = createPinia()
 pinia.use(piniaPluginPersistedstate) // 数据持久化
 
 const app = createApp(App)
-app.use(pinia).use(router)
-app.directive('login', vLogin) // 登录权限指令-未登录先登录
-app.directive('login-show', vLoginShow) // 登录权限指令-未登录先登录
-app.directive('friends', vFriends) // 是否好友
-app.mount('#app')
+app
+  .use(pinia)
+  .use(router)
+  .directive('login', vLogin) // 登录权限指令-未登录先登录
+  .directive('login-show', vLoginShow) // 登录权限指令-未登录先登录
+  .directive('friends', vFriends) // 是否好友
+  .mount('#app')
 // router.isReady().then(() => app.mount('#app'))