From 7a01d9d4a774411dfe1e305bca8fd67cef219f98 Mon Sep 17 00:00:00 2001
From: DCloud_LXH <283700113@qq.com>
Date: Sat, 7 May 2022 14:54:42 +0800
Subject: [PATCH] =?UTF-8?q?fix:=20siderbar=20=E5=B7=B2=E5=B1=95=E5=BC=80?=
 =?UTF-8?q?=E8=8F=9C=E5=8D=95=E5=86=8D=E6=AC=A1=E7=82=B9=E5=87=BB=E6=97=B6?=
 =?UTF-8?q?=E4=B8=8D=E5=B1=95=E5=BC=80=E7=9A=84bug?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../theme/components/SidebarLinks.vue         | 106 ++++++++++++++++++
 1 file changed, 106 insertions(+)
 create mode 100644 docs/.vuepress/theme/components/SidebarLinks.vue

diff --git a/docs/.vuepress/theme/components/SidebarLinks.vue b/docs/.vuepress/theme/components/SidebarLinks.vue
new file mode 100644
index 000000000..9d8ac023f
--- /dev/null
+++ b/docs/.vuepress/theme/components/SidebarLinks.vue
@@ -0,0 +1,106 @@
+<template>
+  <ul
+    v-if="items.length"
+    class="sidebar-links"
+  >
+    <li
+      v-for="(item, i) in items"
+      :key="i"
+    >
+      <SidebarGroup
+        v-if="item.type === 'group'"
+        :item="item"
+        :open="i === openGroupIndex"
+        :collapsable="item.collapsable || item.collapsible"
+        :depth="depth"
+        @toggle="toggleGroup(i)"
+      />
+      <SidebarLink
+        v-else
+        :sidebar-depth="sidebarDepth"
+        :item="item"
+      />
+    </li>
+  </ul>
+</template>
+
+<script>
+import SidebarGroup from '@theme/components/SidebarGroup.vue'
+import SidebarLink from '@theme/components/SidebarLink.vue'
+import { isActive, debounce } from '../util'
+
+export default {
+  name: 'SidebarLinks',
+
+  components: { SidebarGroup, SidebarLink },
+
+  props: [
+    'items',
+    'depth',  // depth of current sidebar links
+    'sidebarDepth', // depth of headers to be extracted
+    'initialOpenGroupIndex'
+  ],
+
+  data () {
+    return {
+      openGroupIndex: this.initialOpenGroupIndex || 0
+    }
+  },
+
+  watch: {
+    '$route': debounce(function () {
+      this.refreshIndex()
+    })
+  },
+
+  created () {
+    this.refreshIndex()
+  },
+
+  methods: {
+    refreshIndex () {
+      const index = resolveOpenGroupIndex(
+        this.$route,
+        this.items
+      )
+      if (index > -1) {
+        this.openGroupIndex = index
+      }
+    },
+
+    toggleGroup (index) {
+      this.openGroupIndex = index === this.openGroupIndex ? -1 : index
+    },
+
+    isActive (page) {
+      return isActive(this.$route, page.regularPath)
+    }
+  }
+}
+
+function resolveOpenGroupIndex (route, items) {
+  for (let i = 0; i < items.length; i++) {
+    const item = items[i]
+    if (descendantIsActive(route, item)) {
+      return i
+    }
+  }
+  return -1
+}
+
+function descendantIsActive (route, item) {
+  if (item.type === 'group') {
+    const childIsActive = item.path && isActive(route, item.path)
+    const grandChildIsActive = item.children.some(child => {
+      if (child.type === 'group') {
+        return descendantIsActive(route, child)
+      } else {
+        return child.type === 'page' && isActive(route, child.path)
+      }
+    })
+
+    return childIsActive || grandChildIsActive
+  }
+  return false
+}
+</script>
-- 
GitLab