update

src/layout/header.vue

@@ -5,10 +5,15 @@
         <a :href="mainURL"><img :src="logoPng" /></a>
       </h2>
 
-      <a-dropdown placement="bottomRight">
+      <a-dropdown placement="bottomRight" trigger="click">
         <template #overlay>
           <a-menu style="width: 100px" @click="handlerMenuClick">
-            <a-menu-item v-for="menu in menus" :key="menu.key">
+            <a-menu-item
+              v-for="menu in menus"
+              :key="menu.key"
+              class="menu-item"
+              :class="{ [menu.key]: true }"
+            >
               {{ menu.label }}
             </a-menu-item>
           </a-menu>
@@ -43,7 +48,7 @@ userStore.fetch()
 
 const menus = [
   { label: '个人中心', key: 'user' },
-  { label: '退出', key: 'logout' }
+  { label: '退出登录', key: 'logout' }
 ]
 const handlerMenuClick: MenuProps['onClick'] = async e => {
   if (e.key === 'logout') {
@@ -54,6 +59,14 @@ const handlerMenuClick: MenuProps['onClick'] = async e => {
   }
 }
 </script>
+<style lang="scss">
+.menu-item {
+  text-align: center;
+  &.logout {
+    color: #fa7c7c;
+  }
+}
+</style>
 
 <style lang="scss" scoped>
 .header-layout {