u

code/link56/link56-frontend/src/components/anchor-menu/index.vue

@@ -0,0 +1,28 @@
+<script lang="ts" setup>
+import type { AnchorMenuItem } from './type'
+
+defineOptions({
+  name: 'AnchorMenu',
+})
+
+defineProps<{
+  menu: AnchorMenuItem[]
+}>()
+</script>
+
+<template>
+  <template v-for="item in menu" :key="item.href">
+    <el-anchor-link :href="`#${item.href}`">
+      {{ item.label }}
+
+      <!-- 如果有子菜单，递归渲染 -->
+      <template v-if="item.children && item.children.length > 0" #sub-link>
+        <AnchorMenu :menu="item.children" />
+      </template>
+    </el-anchor-link>
+  </template>
+</template>
+
+<style lang="scss" scoped>
+/* 样式部分可以根据需要修改 */
+</style>

code/link56/link56-frontend/src/components/anchor-menu/type.ts

@@ -0,0 +1,6 @@
+export interface AnchorMenuItem {
+  label: string
+  href: string
+  level?: number
+  children: AnchorMenuItem[]
+}