mirrors/nocobase
1
0
Fork 0
mirror of https://github.com/nocobase/nocobase synced 2024-11-15 22:27:26 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

perf(ReadPrettyInternalViewer): remove observer

Browse Source
This commit is contained in:
Zeke Zhang 2024-11-10 09:08:18 +08:00
parent 9c0a7e77f3
commit 3241b24042
2 changed files with 60 additions and 64 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

120
packages/core/client/src/schema-component/antd/association-field/InternalViewer.tsx
View File

@ -7,7 +7,7 @@
* For more information, please refer to: https://www.nocobase.com/agreement. * For more information, please refer to: https://www.nocobase.com/agreement.
*/ */
import { observer, RecursionField, useField, useFieldSchema } from '@formily/react'; import { RecursionField, useField, useFieldSchema } from '@formily/react';
import { toArr } from '@formily/shared'; import { toArr } from '@formily/shared';
import _ from 'lodash'; import _ from 'lodash';
import React, { FC, Fragment, useEffect, useRef, useState } from 'react'; import React, { FC, Fragment, useEffect, useRef, useState } from 'react';
@ -241,68 +241,64 @@ const getSourceData = (recordData, fieldSchema) => {
return _.get(recordData, sourceRecordKey); return _.get(recordData, sourceRecordKey);
}; };
export const ReadPrettyInternalViewer: React.FC = observer( export const ReadPrettyInternalViewer: React.FC<ReadPrettyInternalViewerProps> = (props) => {
(props: ReadPrettyInternalViewerProps) => { const { value, ButtonList = ButtonLinkList } = props;
const { value, ButtonList = ButtonLinkList } = props; const fieldSchema = useFieldSchema();
const fieldSchema = useFieldSchema(); const { enableLink } = fieldSchema['x-component-props'] || {};
const { enableLink } = fieldSchema['x-component-props'] || {}; // value 做了转换，但 props.value 和原来 useField().value 的值不一致
// value 做了转换，但 props.value 和原来 useField().value 的值不一致 const field = useField();
const field = useField(); const [visible, setVisible] = useState(false);
const [visible, setVisible] = useState(false); const { options: collectionField } = useAssociationFieldContext();
const { options: collectionField } = useAssociationFieldContext(); const { visibleWithURL, setVisibleWithURL } = usePopupUtils();
const ellipsisWithTooltipRef = useRef<IEllipsisWithTooltipRef>(); const [btnHover, setBtnHover] = useState(!!visibleWithURL);
const { visibleWithURL, setVisibleWithURL } = usePopupUtils(); const { defaultOpenMode } = useOpenModeContext();
const [btnHover, setBtnHover] = useState(!!visibleWithURL); const recordData = useCollectionRecordData();
const { defaultOpenMode } = useOpenModeContext();
const recordData = useCollectionRecordData();
const btnElement = ( const btnElement = (
<EllipsisWithTooltip ellipsis={true} ref={ellipsisWithTooltipRef}> <EllipsisWithTooltip ellipsis={true}>
<CollectionRecordProvider isNew={false} record={getSourceData(recordData, fieldSchema)}> <CollectionRecordProvider isNew={false} record={getSourceData(recordData, fieldSchema)}>
<ButtonList setBtnHover={setBtnHover} value={value} fieldNames={props.fieldNames} /> <ButtonList setBtnHover={setBtnHover} value={value} fieldNames={props.fieldNames} />
</CollectionRecordProvider> </CollectionRecordProvider>
</EllipsisWithTooltip> </EllipsisWithTooltip>
); );
if (enableLink === false || !btnHover) { if (enableLink === false || !btnHover) {
return btnElement; return btnElement;
} }
const renderWithoutTableFieldResourceProvider = () => ( const renderWithoutTableFieldResourceProvider = () => (
// The recordData here is only provided when the popup is opened, not the current row record // The recordData here is only provided when the popup is opened, not the current row record
<VariablePopupRecordProvider> <VariablePopupRecordProvider>
<WithoutTableFieldResource.Provider value={true}> <WithoutTableFieldResource.Provider value={true}>
<RecursionField <RecursionField
schema={fieldSchema} schema={fieldSchema}
onlyRenderProperties onlyRenderProperties
basePath={field.address} basePath={field.address}
filterProperties={(s) => { filterProperties={(s) => {
return s['x-component'] === 'AssociationField.Viewer'; return s['x-component'] === 'AssociationField.Viewer';
}}
/>
</WithoutTableFieldResource.Provider>
</VariablePopupRecordProvider>
);
return (
<PopupVisibleProvider visible={false}>
<ActionContextProvider
value={{
visible: visible || visibleWithURL,
setVisible: (value) => {
setVisible?.(value);
setVisibleWithURL?.(value);
},
openMode: defaultOpenMode,
snapshot: collectionField?.interface === 'snapshot',
fieldSchema: fieldSchema,
}} }}
> />
{btnElement} </WithoutTableFieldResource.Provider>
{renderWithoutTableFieldResourceProvider()} </VariablePopupRecordProvider>
</ActionContextProvider> );
</PopupVisibleProvider>
); return (
}, <PopupVisibleProvider visible={false}>
{ displayName: 'ReadPrettyInternalViewer' }, <ActionContextProvider
); value={{
visible: visible || visibleWithURL,
setVisible: (value) => {
setVisible?.(value);
setVisibleWithURL?.(value);
},
openMode: defaultOpenMode,
snapshot: collectionField?.interface === 'snapshot',
fieldSchema: fieldSchema,
}}
>
{btnElement}
{renderWithoutTableFieldResourceProvider()}
</ActionContextProvider>
</PopupVisibleProvider>
);
};

4
packages/core/client/src/schema-component/antd/table-v2/components/ColumnFieldProvider.tsx
View File

@ -7,9 +7,9 @@
* For more information, please refer to: https://www.nocobase.com/agreement. * For more information, please refer to: https://www.nocobase.com/agreement.
*/ */
import { RecursionField } from '@formily/react';
import React, { useMemo } from 'react'; import React, { useMemo } from 'react';
import { useCollection } from '../../../../data-source'; import { useCollection } from '../../../../data-source';
import { NocoBaseRecursionField } from '../../../../formily/NocoBaseRecursionField';
import { useRecord } from '../../../../record-provider'; import { useRecord } from '../../../../record-provider';
export const ColumnFieldProvider = (props: { schema: any; basePath: any; children: any }) => { export const ColumnFieldProvider = (props: { schema: any; basePath: any; children: any }) => {
@ -45,7 +45,7 @@ export const ColumnFieldProvider = (props: { schema: any; basePath: any; childre
}, },
}, },
}; };
return <RecursionField basePath={basePath} schema={newSchema} onlyRenderProperties />; return <NocoBaseRecursionField basePath={basePath} schema={newSchema} onlyRenderProperties />;
} }
return props.children; return props.children;
}; };