From 1b7d3dae330d3dbef18ff0cbd85d577b9dc877d7 Mon Sep 17 00:00:00 2001
From: pengzhanbo <volodymyr@foxmail.com>
Date: Sat, 23 Dec 2023 01:53:33 +0800
Subject: [PATCH] =?UTF-8?q?feat:=20=E5=AF=BC=E8=88=AA=E6=A0=8F=E5=AD=90?=
 =?UTF-8?q?=E5=85=83=E7=B4=A0=E9=AB=98=E4=BA=AE=E6=97=B6=E7=88=B6=E5=85=83?=
 =?UTF-8?q?=E7=B4=A0=E9=AB=98=E4=BA=AE?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../client/components/Nav/NavBarMenuGroup.vue | 20 ++++++++++++++++---
 1 file changed, 17 insertions(+), 3 deletions(-)

diff --git a/packages/theme/src/client/components/Nav/NavBarMenuGroup.vue b/packages/theme/src/client/components/Nav/NavBarMenuGroup.vue
index 9633f38b..a1377e51 100644
--- a/packages/theme/src/client/components/Nav/NavBarMenuGroup.vue
+++ b/packages/theme/src/client/components/Nav/NavBarMenuGroup.vue
@@ -1,21 +1,35 @@
 <script lang="ts" setup>
 import { usePageData } from '@vuepress/client'
-import type { NavItemWithChildren } from '../../../shared/index.js'
+import { computed } from 'vue'
+import type { NavItem, NavItemWithChildren } from '../../../shared/index.js'
 import { isActive } from '../../utils/index.js'
 import Flyout from '../Flyout/index.vue'
 
-defineProps<{
+const props = defineProps<{
   item: NavItemWithChildren
 }>()
 
 const page = usePageData()
+
+const isChildActive = (navItem: NavItem) => {
+  if ('link' in navItem) {
+    return isActive(
+      page.value.path,
+      navItem.link,
+      !!props.item.activeMatch
+    )
+  } else {
+    return navItem.items.some(isChildActive)
+  }
+}
+const childrenActive = computed(() => isChildActive(props.item))
 </script>
 
 <template>
   <Flyout
     :class="{
       'navbar-menu-group': true,
-      'active': isActive(page.path, item.activeMatch, !!item.activeMatch),
+      'active': isActive(page.path, item.activeMatch, !!item.activeMatch) || childrenActive,
     }"
     :button="item.text"
     :items="item.items"