fix(client): get sideMenuRef from context

This commit is contained in:
chenos 2022-01-24 15:47:45 +08:00
parent 1238f1ee8c
commit 6ba2d6b5e5
3 changed files with 15 additions and 5 deletions

View File

@ -18,7 +18,7 @@ export default (apiClient: APIClient) => {
theme: 'dark',
// defaultSelectedUid: 'u8',
onSelect: '{{ onSelect }}',
sideMenuRef: '{{ sideMenuRef }}',
sideMenuRefScopeKey: 'sideMenuRef',
},
properties: {
item3: {

View File

@ -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

View File

@ -16,7 +16,7 @@ const schema: ISchema = {
mode: 'mix',
theme: 'dark',
defaultSelectedUid: 'u8',
sideMenuRef: '{{ sideMenuRef }}',
sideMenuRefScopeKey: 'sideMenuRef',
},
properties: {
item1: {