From bf7754af8af8448ed4d9ac425efc360d86df24d6 Mon Sep 17 00:00:00 2001
From: heshunme <heshunme@outlook.com>
Date: Sat, 6 Jul 2024 14:46:03 +0800
Subject: [PATCH] =?UTF-8?q?=E5=8A=A0=E4=BA=86=E4=B8=80=E4=B8=AA=E5=AF=BC?=
 =?UTF-8?q?=E8=88=AA=E6=A0=8F?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/App.vue | 35 +++++++++++++++++++++++++++++++++++
 1 file changed, 35 insertions(+)

diff --git a/src/App.vue b/src/App.vue
index 58e057f..502c8ab 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -1,8 +1,43 @@
+<script setup>
+import {ref} from "vue";
+
+const activeIndex = ref('1')
+const handleSelect = (key, keyPath) => {
+  console.log(key, keyPath)
+}
+</script>
+
 <template>
+  <el-menu
+      :default-active="activeIndex"
+      class="el-menu-demo"
+      mode="horizontal"
+      @select="handleSelect"
+  >
+    <el-menu-item index="1">
+      <router-link to="/" class="no-underline">首页</router-link>
+    </el-menu-item>
+  </el-menu>
   <div>
     <router-view></router-view>
   </div>
 </template>
 
 <style scoped>
+.el-menu-demo {
+  width: 100%;
+  top: 0;
+  z-index: 1000;
+  display: flex;
+  justify-content: center; /* 中心对齐 */
+}
+
+.no-underline {
+  text-decoration: none;
+  color: inherit; /* 保持文字颜色与父元素一致 */
+}
+
+.el-menu-item .no-underline:hover {
+  color: #409EFF; /* 鼠标悬停时的颜色，可以根据需要调整 */
+}
 </style>