diff --git a/packages/opendesign/src/anchor/OAnchorItem.vue b/packages/opendesign/src/anchor/OAnchorItem.vue
index c069fb20885bdb074570cbb54ce3f93065cefbb5..2f5eb44c166d20bbd7548c68d62f16e38db13bf0 100644
--- a/packages/opendesign/src/anchor/OAnchorItem.vue
+++ b/packages/opendesign/src/anchor/OAnchorItem.vue
@@ -21,22 +21,24 @@ const emits = defineEmits<{
 const anchorInjection = inject(anchorInjectKey, null);
 const anchorItemInjection = inject(anchorItemInjectKey, null);
 
+const _observeHref = computed(() => props.observeHref || props.href)
+
 const isActive = computed(() => {
-  return props.href === anchorInjection?.activeLink.value;
+  return _observeHref.value === anchorInjection?.activeLink.value;
 });
 
 const addItem = () => {
-  if (!props.href) {
+  if (!_observeHref.value) {
     return;
   }
-  anchorInjection?.addLink(props.href);
+  anchorInjection?.addLink(_observeHref.value);
 };
 
 const removeItem = () => {
-  if (!props.href) {
+  if (!_observeHref.value) {
     return;
   }
-  anchorInjection?.removeLink(props.href);
+  anchorInjection?.removeLink(_observeHref.value);
 };
 
 const onClick = (event: MouseEvent) => {
@@ -60,15 +62,15 @@ const onClick = (event: MouseEvent) => {
    */
   anchorInjection?.onItemClick({
     event: event,
-    link: props.href,
+    link: _observeHref.value,
   });
-  if (props.href) {
-    anchorInjection?.scrollIntoView(props.href);
+  if (_observeHref.value) {
+    anchorInjection?.scrollIntoView(_observeHref.value);
   }
 };
 
 watch(
-  () => props.href,
+  () => _observeHref.value,
   (newVal, oldVal) => {
     nextTick(() => {
       if (oldVal) {
diff --git a/packages/opendesign/src/anchor/__docs__/__case__/AnchorUsage.vue b/packages/opendesign/src/anchor/__docs__/__case__/AnchorUsage.vue
index ac7addf227aeb51414257ff9590cdf0f2e2bf49a..83e99cd952e5c1e495a0ac9f34301f3b3c700915 100644
--- a/packages/opendesign/src/anchor/__docs__/__case__/AnchorUsage.vue
+++ b/packages/opendesign/src/anchor/__docs__/__case__/AnchorUsage.vue
@@ -126,14 +126,14 @@ const _oTemplate: DocDemoTemplate<typeof _oSchema> = (props) => {
           <OAnchorItem href="#container-block1-1" title="container-block1-1" />
         </OAnchorItem>
         <OAnchorItem href="#container-block2" title="container-block2">
-          <OAnchorItem href="#container-block2-1" title="container-block2-1" />
+          <OAnchorItem href="https://docs.openeuler.org" observe-href="#container-block2-1" title="自定义监听container-block2-1" />
           <OAnchorItem href="#container-block2-2" title="container-block2-2">
             <OAnchorItem href="#container-block2-2-1" title="container-block2-2-1换行openEuler Developer Day 2023 （简称 ODD 2023）是开放原子开源基金会旗下 openEuler 社区" />
           </OAnchorItem>
         </OAnchorItem>
         <OAnchorItem href="#container-block4" title="container-block4" />
         <OAnchorItem href="#container-block5" title="container-block5">
-          <OAnchorItem href="#container-block5-1" title="externalHref" external-href="https://docs.openeuler.org" />
+          <OAnchorItem href="#container-block5-1" title="container-block5-1" />
         </OAnchorItem>
       </OAnchor>
     </div>
diff --git a/packages/opendesign/src/anchor/types.ts b/packages/opendesign/src/anchor/types.ts
index 862fb67f31251dcbae9e7d1cd60fb093d18e747f..4c16b5ab627f10ba581a86a6ce071b6b7f458300 100644
--- a/packages/opendesign/src/anchor/types.ts
+++ b/packages/opendesign/src/anchor/types.ts
@@ -68,6 +68,13 @@ export const anchorItemProps = {
     type: String,
     required: true,
   },
+  /**
+   * @zh-CN 锚点监听的目标元素(带#前缀),不传时监听href
+   * @en-US Target element for anchor observe (with # prefix)，Use href prop by default
+   */
+  observeHref: {
+    type: String,
+  },
   /**
    * @zh-CN 锚点跳转方式
    * @en-US Anchor navigation method