From 3155c086ca343bed4a3c2e19c3fc5414c0f17050 Mon Sep 17 00:00:00 2001
From: pany <939630029@qq.com>
Date: Thu, 21 Nov 2024 11:28:37 +0800
Subject: [PATCH] =?UTF-8?q?feat:=20=E5=B7=A6=E4=BE=A7=E5=AF=BC=E8=88=AA?=
 =?UTF-8?q?=E8=8F=9C=E5=8D=95=20title=20=E8=BF=87=E9=95=BF=E8=87=AA?=
 =?UTF-8?q?=E5=8A=A8=E7=9C=81=E7=95=A5?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/layouts/components/Sidebar/SidebarItem.vue | 10 ++++++++--
 1 file changed, 8 insertions(+), 2 deletions(-)

diff --git a/src/layouts/components/Sidebar/SidebarItem.vue b/src/layouts/components/Sidebar/SidebarItem.vue
index 0e16e63f..ab7add13 100644
--- a/src/layouts/components/Sidebar/SidebarItem.vue
+++ b/src/layouts/components/Sidebar/SidebarItem.vue
@@ -60,7 +60,7 @@ function resolvePath(routePath: string) {
         <SvgIcon v-if="theOnlyOneChild.meta.svgIcon" :name="theOnlyOneChild.meta.svgIcon" />
         <component v-else-if="theOnlyOneChild.meta.elIcon" :is="theOnlyOneChild.meta.elIcon" class="el-icon" />
         <template v-if="theOnlyOneChild.meta.title" #title>
-          {{ theOnlyOneChild.meta.title }}
+          <span class="title">{{ theOnlyOneChild.meta.title }}</span>
         </template>
       </el-menu-item>
     </SidebarItemLink>
@@ -69,7 +69,7 @@ function resolvePath(routePath: string) {
     <template #title>
       <SvgIcon v-if="props.item.meta?.svgIcon" :name="props.item.meta.svgIcon" />
       <component v-else-if="props.item.meta?.elIcon" :is="props.item.meta.elIcon" class="el-icon" />
-      <span v-if="props.item.meta?.title">{{ props.item.meta.title }}</span>
+      <span v-if="props.item.meta?.title" class="title">{{ props.item.meta.title }}</span>
     </template>
     <template v-if="props.item.children">
       <SidebarItem
@@ -83,6 +83,8 @@ function resolvePath(routePath: string) {
 </template>
 
 <style lang="scss" scoped>
+@import "@/styles/mixins.scss";
+
 .svg-icon {
   min-width: 1em;
   margin-right: 12px;
@@ -94,4 +96,8 @@ function resolvePath(routePath: string) {
   margin-right: 12px !important;
   font-size: 18px;
 }
+
+.title {
+  @extend %ellipsis;
+}
 </style>