Bläddra i källkod

perf: 优化平台`logo`获取方式

xiaoxian521 1 år sedan
förälder
incheckning
14624119ed

+ 2 - 1
src/layout/components/sidebar/horizontal.vue

@@ -21,6 +21,7 @@ const {
   logout,
   backTopMenu,
   onPanel,
+  getLogo,
   username,
   userAvatar,
   avatarsStyle,
@@ -43,7 +44,7 @@ nextTick(() => {
     class="horizontal-header"
   >
     <div class="horizontal-header-left" @click="backTopMenu">
-      <img src="/logo.svg" alt="logo" />
+      <img :src="getLogo()" alt="logo" />
       <span>{{ title }}</span>
     </div>
     <el-menu

+ 3 - 3
src/layout/components/sidebar/logo.vue

@@ -6,7 +6,7 @@ const props = defineProps({
   collapse: Boolean
 });
 
-const { title } = useNav();
+const { title, getLogo } = useNav();
 </script>
 
 <template>
@@ -19,7 +19,7 @@ const { title } = useNav();
         class="sidebar-logo-link"
         :to="getTopMenu()?.path ?? '/'"
       >
-        <img src="/logo.svg" alt="logo" />
+        <img :src="getLogo()" alt="logo" />
         <span class="sidebar-title">{{ title }}</span>
       </router-link>
       <router-link
@@ -29,7 +29,7 @@ const { title } = useNav();
         class="sidebar-logo-link"
         :to="getTopMenu()?.path ?? '/'"
       >
-        <img src="/logo.svg" alt="logo" />
+        <img :src="getLogo()" alt="logo" />
         <span class="sidebar-title">{{ title }}</span>
       </router-link>
     </transition>

+ 6 - 0
src/layout/hooks/useNav.ts

@@ -124,6 +124,11 @@ export function useNav() {
     return remainingPaths.includes(path);
   }
 
+  /** 获取`logo` */
+  function getLogo() {
+    return new URL("/logo.svg", import.meta.url).href;
+  }
+
   return {
     title,
     device,
@@ -139,6 +144,7 @@ export function useNav() {
     menuSelect,
     handleResize,
     resolvePath,
+    getLogo,
     isCollapse,
     pureApp,
     username,

+ 3 - 1
src/views/components/animatecss/index.vue

@@ -8,7 +8,9 @@ defineOptions({
 
 const icon = ref("");
 
-watch(icon, () => console.log("icon", icon.value));
+watch(icon, () => {
+  console.log("icon", icon.value);
+});
 </script>
 
 <template>