perf(LinkageRules): improve style performance

This commit is contained in:
Zeke Zhang 2024-10-30 14:44:22 +08:00
parent 26f100c9e4
commit 5d2a9ace48
2 changed files with 7 additions and 14 deletions

View File

@ -7,12 +7,6 @@
* For more information, please refer to: https://www.nocobase.com/agreement.
*/
import { createStyles } from 'antd-style';
export const useStyles = createStyles(() => {
return {
arrayCollapseItem: {
marginBottom: '10px',
},
};
});
export const arrayCollapseItemStyle = {
marginBottom: 10,
};

View File

@ -13,12 +13,11 @@ import { ArrayField } from '@formily/core';
import { ISchema, RecursionField, observer, useField, useFieldSchema } from '@formily/react';
import { toArr } from '@formily/shared';
import { Badge, Card, Collapse, CollapsePanelProps, CollapseProps, Empty, Input } from 'antd';
import cls from 'classnames';
import { cloneDeep } from 'lodash';
import React, { Fragment, useEffect, useState } from 'react';
import { useTranslation } from 'react-i18next';
import { useToken } from '../../../style';
import { useStyles } from './LinkageHeader.style';
import { arrayCollapseItemStyle } from './LinkageHeader.style';
const LinkageRulesTitle = (props) => {
const array = ArrayBase.useArray();
@ -103,7 +102,6 @@ const insertActiveKeys = (activeKeys: number[], index: number) => {
export const ArrayCollapse: ComposedArrayCollapse = observer(
(props: IArrayCollapseProps) => {
const { styles } = useStyles();
const field = useField<ArrayField>();
const dataSource = Array.isArray(field.value) ? field.value : [];
const [activeKeys, setActiveKeys] = useState<number[]>(
@ -128,7 +126,7 @@ export const ArrayCollapse: ComposedArrayCollapse = observer(
const renderEmpty = () => {
if (dataSource.length) return;
return (
<Card className={cls(`${styles.arrayCollapseItem}`, props.className)}>
<Card className={props.className} style={arrayCollapseItemStyle}>
<Empty />
</Card>
);
@ -140,7 +138,8 @@ export const ArrayCollapse: ComposedArrayCollapse = observer(
{...props}
activeKey={activeKeys}
onChange={(keys: string[]) => setActiveKeys(toArr(keys).map(Number))}
className={cls(`${styles.arrayCollapseItem}`, props.className)}
className={props.className}
style={arrayCollapseItemStyle}
>
{dataSource.map((item, index) => {
const items = Array.isArray(schema.items) ? schema.items[index] || schema.items[0] : schema.items;