Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly
Sign up
Appearance settings

Commit 02b6166

Browse files
memoize transfer comp's view and propertyView
1 parent 0ee2935 commit 02b6166

File tree

1 file changed

+49
-40
lines changed

1 file changed

+49
-40
lines changed

‎client/packages/lowcoder/src/comps/comps/transferComp.tsx‎

Lines changed: 49 additions & 40 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,9 @@
1-
import { CompAction, RecordConstructorToView, changeChildAction } from "lowcoder-core";
1+
import { CompAction, RecordConstructorToComp,RecordConstructorToView, changeChildAction } from "lowcoder-core";
22
import { BoolControl } from "comps/controls/boolControl";
33
import { arrayObjectExposingStateControl, arrayStringExposingStateControl } from "comps/controls/codeStateControl";
44
import { styleControl } from "comps/controls/styleControl";
55
import { TransferStyle, TransferStyleType, heightCalculator, widthCalculator } from "comps/controls/styleControlConstants";
6-
import { UICompBuilder } from "comps/generators/uiCompBuilder";
6+
import { NewChildren,UICompBuilder } from "comps/generators/uiCompBuilder";
77
import { NameConfig, NameConfigHidden, withExposingConfigs } from "comps/generators/withExposing";
88
import { Section, sectionNames } from "lowcoder-design";
99
import { hiddenPropertyView, showDataLoadingIndicatorsPropertyView } from "comps/utils/propertyUtils";
@@ -17,6 +17,7 @@ import styled, { css } from "styled-components";
1717
import { useContext, useEffect, useRef, useState } from "react";
1818
import { valueComp, withDefault } from "../generators";
1919
import type { TransferDirection } from 'antd/es/transfer';
20+
import React from "react";
2021

2122
const Container = styled.div<{ $style: TransferStyleType }>`
2223
height: 100%;
@@ -71,7 +72,9 @@ const childrenMap = {
7172
searchInfo: valueComp<string[]>(['', '']),
7273
};
7374

74-
const TransferView = (props: RecordConstructorToView<typeof childrenMap> & {
75+
type ChildrenType = NewChildren<RecordConstructorToComp<typeof childrenMap>>;
76+
77+
const TransferView = React.memo((props: RecordConstructorToView<typeof childrenMap> & {
7578
dispatch: (action: CompAction) => void;
7679
}) => {
7780
const conRef = useRef<HTMLDivElement>(null);
@@ -136,48 +139,54 @@ const TransferView = (props: RecordConstructorToView<typeof childrenMap> & {
136139
</Container>
137140
</ReactResizeDetector>
138141
);
139-
};
142+
});
143+
144+
const TransferCompPropertyView = React.memo((props: {
145+
children: ChildrenType
146+
}) => {
147+
return (
148+
<>
149+
<Section name={sectionNames.basic}>
150+
{props.children.items.propertyView({
151+
label: trans("transfer.items"),
152+
})}
153+
{props.children.targetKeys.propertyView({
154+
label: trans("transfer.targetKeys"),
155+
})}
156+
{props.children.sourceTitle.propertyView({
157+
label: trans("transfer.sourceTitle"),
158+
})}
159+
{props.children.targetTitle.propertyView({
160+
label: trans("transfer.targetTitle"),
161+
})}
162+
{props.children.showSearch.propertyView({
163+
label: trans("transfer.allowSearch"),
164+
})}
165+
{props.children.oneWay.propertyView({
166+
label: trans("transfer.oneWay"),
167+
})}
168+
{props.children.pagination.propertyView({
169+
label: trans("transfer.pagination"),
170+
})}
171+
{props.children.pagination.getView() && props.children.pageSize.propertyView({
172+
label: trans("transfer.pageSize"),
173+
})}
174+
</Section>
175+
<Section name={sectionNames.interaction}>
176+
{props.children.onEvent.propertyView()}
177+
{hiddenPropertyView(props.children)}
178+
{showDataLoadingIndicatorsPropertyView(props.children)}
179+
</Section>
180+
<Section name={sectionNames.style}>{props.children.style.getPropertyView()}</Section>
181+
</>
182+
)
183+
});
140184

141185
let TransferBasicComp = (function () {
142186
return new UICompBuilder(childrenMap, (props, dispatch) => {
143187
return (
144188
<TransferView {...props} dispatch={dispatch} />)})
145-
.setPropertyViewFn((children) => (
146-
<>
147-
<Section name={sectionNames.basic}>
148-
{children.items.propertyView({
149-
label: trans("transfer.items"),
150-
})}
151-
{children.targetKeys.propertyView({
152-
label: trans("transfer.targetKeys"),
153-
})}
154-
{children.sourceTitle.propertyView({
155-
label: trans("transfer.sourceTitle"),
156-
})}
157-
{children.targetTitle.propertyView({
158-
label: trans("transfer.targetTitle"),
159-
})}
160-
{children.showSearch.propertyView({
161-
label: trans("transfer.allowSearch"),
162-
})}
163-
{children.oneWay.propertyView({
164-
label: trans("transfer.oneWay"),
165-
})}
166-
{children.pagination.propertyView({
167-
label: trans("transfer.pagination"),
168-
})}
169-
{children.pagination.getView() && children.pageSize.propertyView({
170-
label: trans("transfer.pageSize"),
171-
})}
172-
</Section>
173-
<Section name={sectionNames.interaction}>
174-
{children.onEvent.propertyView()}
175-
{hiddenPropertyView(children)}
176-
{showDataLoadingIndicatorsPropertyView(children)}
177-
</Section>
178-
<Section name={sectionNames.style}>{children.style.getPropertyView()}</Section>
179-
</>
180-
))
189+
.setPropertyViewFn((children) => <TransferCompPropertyView children={children} />)
181190
.build();
182191
})();
183192

0 commit comments

Comments
(0)

AltStyle によって変換されたページ (->オリジナル) /