From ec6654f944486f0fcfa27d26d07c17722b38c213 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E8=8B=8F=E5=90=91=E5=A4=9C?= <fu050409@163.com>
Date: Thu, 27 Jun 2024 20:16:02 +0800
Subject: [PATCH] fix(active): fix errors in active bars

- Add checks before activate active bars in the code
---
 .../devui-theme/composables/activeBar.ts      | 31 +++++++++----------
 1 file changed, 15 insertions(+), 16 deletions(-)

diff --git a/packages/devui-vue/docs/.vitepress/devui-theme/composables/activeBar.ts b/packages/devui-vue/docs/.vitepress/devui-theme/composables/activeBar.ts
index 2064e378dc..95ad9fec90 100644
--- a/packages/devui-vue/docs/.vitepress/devui-theme/composables/activeBar.ts
+++ b/packages/devui-vue/docs/.vitepress/devui-theme/composables/activeBar.ts
@@ -47,22 +47,21 @@ export function useActiveSidebarLinks(container: Ref<HTMLElement>, marker: Ref<H
   let prevActiveLink: HTMLAnchorElement | null = null;
 
   function activateLink(hash: string) {
-    deactiveLink(prevActiveLink);
+    prevActiveLink && deactiveLink(prevActiveLink);
 
-    // const activeLink = (prevActiveLink =
-    //   hash == null
-    //     ? null
-    //     : (container.value.querySelector(
-    //         `.devui-item a[href="${decodeURIComponent(hash)}"]`
-    //       ) as HTMLAnchorElement))
-    // if (activeLink) {
-    //   activeLink.classList.add('active')
-    //   marker.value.style.opacity = '1'
-    //   marker.value.style.top = `${activeLink.offsetTop}px`
-    // } else {
-    //   marker.value.style.opacity = '0'
-    //   marker.value.style.top = '33px'
-    // }
+    const activeLink = (prevActiveLink =
+      hash == null
+        ? null
+        : container.value && (container.value.querySelector(`.devui-item a[href="${decodeURIComponent(hash)}"]`) as HTMLAnchorElement));
+    if (marker.value)
+      if (activeLink) {
+        activeLink.classList.add('active');
+        marker.value.style.opacity = '1';
+        marker.value.style.top = `${activeLink.offsetTop}px`;
+      } else {
+        marker.value.style.opacity = '0';
+        marker.value.style.top = '33px';
+      }
   }
 
   function deactiveLink(link: HTMLElement) {
@@ -96,7 +95,7 @@ function getPageOffset() {
 function getAnchorTop(anchor: HTMLAnchorElement) {
   const pageOffset = getPageOffset();
   try {
-    return anchor.parentElement.offsetTop - pageOffset - 15;
+    return anchor.parentElement?.offsetTop ? anchor.parentElement.offsetTop - pageOffset - 15 : 0;
   } catch (e) {
     return 0;
   }