diff --git a/packages/client/src/application/demos/demo2/mock.ts b/packages/client/src/application/demos/demo2/mock.ts
index c5b6b7d63c..1426fa7bf0 100644
--- a/packages/client/src/application/demos/demo2/mock.ts
+++ b/packages/client/src/application/demos/demo2/mock.ts
@@ -18,7 +18,7 @@ export default (apiClient: APIClient) => {
         theme: 'dark',
         // defaultSelectedUid: 'u8',
         onSelect: '{{ onSelect }}',
-        sideMenuRef: '{{ sideMenuRef }}',
+        sideMenuRefScopeKey: 'sideMenuRef',
       },
       properties: {
         item3: {
diff --git a/packages/client/src/schema-component/antd/menu/Menu.tsx b/packages/client/src/schema-component/antd/menu/Menu.tsx
index 1dab6237d0..3857d5e6c8 100644
--- a/packages/client/src/schema-component/antd/menu/Menu.tsx
+++ b/packages/client/src/schema-component/antd/menu/Menu.tsx
@@ -1,5 +1,5 @@
 import { DesktopOutlined } from '@ant-design/icons';
-import { observer, RecursionField, Schema, useFieldSchema } from '@formily/react';
+import { observer, RecursionField, Schema, SchemaExpressionScopeContext, useFieldSchema } from '@formily/react';
 import { Menu as AntdMenu } from 'antd';
 import React, { createContext, useContext, useEffect, useState } from 'react';
 import { createPortal } from 'react-dom';
@@ -12,10 +12,19 @@ type ComposedMenu = React.FC<any> & {
 
 const MenuModeContext = createContext(null);
 
+const useSideMenuRef = () => {
+  const schema = useFieldSchema();
+  const scope = useContext(SchemaExpressionScopeContext);
+  const scopeKey = schema?.['x-component-props']?.['sideMenuRefScopeKey'];
+  if (!scopeKey) {
+    return;
+  }
+  return scope[scopeKey];
+}
+
 export const Menu: ComposedMenu = observer((props) => {
   let {
     onSelect,
-    sideMenuRef,
     mode,
     defaultSelectedUid,
     defaultSelectedKeys: dSelectedKeys,
@@ -24,6 +33,7 @@ export const Menu: ComposedMenu = observer((props) => {
   } = props;
   console.log('defaultSelectedUid', defaultSelectedUid)
   const schema = useFieldSchema();
+  const sideMenuRef = useSideMenuRef();
   const [defaultSelectedKeys, setDefaultSelectedKeys] = useState(() => {
     if (dSelectedKeys) {
       return dSelectedKeys;
@@ -107,7 +117,7 @@ export const Menu: ComposedMenu = observer((props) => {
         ? null
         : mode === 'mix' &&
           sideMenuSchema?.properties &&
-          sideMenuRef.current?.firstChild &&
+          sideMenuRef?.current?.firstChild &&
           createPortal(
             <MenuModeContext.Provider value={'inline'}>
               <AntdMenu
diff --git a/packages/client/src/schema-component/antd/menu/demos/demo3.tsx b/packages/client/src/schema-component/antd/menu/demos/demo3.tsx
index 10f3906910..782c561f11 100644
--- a/packages/client/src/schema-component/antd/menu/demos/demo3.tsx
+++ b/packages/client/src/schema-component/antd/menu/demos/demo3.tsx
@@ -16,7 +16,7 @@ const schema: ISchema = {
         mode: 'mix',
         theme: 'dark',
         defaultSelectedUid: 'u8',
-        sideMenuRef: '{{ sideMenuRef }}',
+        sideMenuRefScopeKey: 'sideMenuRef',
       },
       properties: {
         item1: {