feat:重构导航栏侧边栏

docs/Web-Front/index.md

@@ -8,15 +8,16 @@ description: Web前端开发技术文档
 
 前端开发技术栈的学习笔记和总结。
 
-### 🌿 Vue
-Vue 框架学习：
+<script setup>
+import { routers } from '../.vitepress/theme/router'
+import { withBase } from 'vitepress'
+</script>
 
-- [Vue3-Common](/Web-Front/Vue/Vue3-Common)
-- [Vue3架构原理](/Web-Front/Vue/Vue3-Architecture)
-
-### 🔄 其他
-
-- [JavaScript知识点整理](/Web-Front/Others/JavaScript-Guide)
-- [前端包管理器](/Web-Front/Others/Package)
-- [Vite核心原理](/Web-Front/Others/Vite-Principle)
-- [浏览器渲染全流程解析](/Web-Front/Others/Browser-Process)
+<div v-for="category in routers[0].items" :key="category.text">
+    <h3>{{ category.text }}</h3>
+    <ul>
+        <li v-for="item in category.items" :key="item.text">
+            <a :href="withBase(item.link)">{{ item.text }}</a>
+        </li>
+    </ul>
+</div>