p85126437
/
amis
forked from p96170835/amis
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

Combo 性能优化

This commit is contained in:
liaoxuezhi 2019-11-14 20:30:48 +08:00
parent 055b0b2edb
commit 477e5d1758
6 changed files with 65 additions and 34 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

59
src/renderers/Form/Combo.tsx
View File

@ -107,7 +107,12 @@ export default class ComboControl extends React.Component<ComboProps> {
];
subForms: Array<any> = [];
subFormDefaultValues: Array<{index: number; values: any}> = [];
subFormDefaultValues: Array<{
index: number;
values: any;
setted: boolean;
}> = [];
keys: Array<string> = [];
dragTip?: HTMLElement;
sortable?: Sortable;
@ -118,6 +123,7 @@ export default class ComboControl extends React.Component<ComboProps> {
this.handleChange = this.handleChange.bind(this);
this.handleSingleFormChange = this.handleSingleFormChange.bind(this);
this.handleSingleFormInit = this.handleSingleFormInit.bind(this);
this.handleFormInit = this.handleFormInit.bind(this);
this.handleAction = this.handleAction.bind(this);
this.addItem = this.addItem.bind(this);
this.removeItem = this.removeItem.bind(this);
@ -275,7 +281,7 @@ export default class ComboControl extends React.Component<ComboProps> {
this.props.onChange(value);
}
handleChange(index: number, values: any) {
handleChange(values: any, diff: any, {index}: any) {
const {
formItem,
flat,
@ -314,13 +320,16 @@ export default class ComboControl extends React.Component<ComboProps> {
});
}
handleFormInit(index: number, values: any) {
handleFormInit(values: any, {index}: any) {
const {
syncDefaultValue,
disabled,
flat,
joinValues,
delimiter
delimiter,
formInited,
onChange,
setPrinstineValue
} = this.props;
if (syncDefaultValue === false || disabled) {
@ -329,7 +338,8 @@ export default class ComboControl extends React.Component<ComboProps> {
this.subFormDefaultValues.push({
index,
values
values,
setted: false
});
if (this.subFormDefaultValues.length !== this.subForms.length) {
@ -337,21 +347,27 @@ export default class ComboControl extends React.Component<ComboProps> {
}
let value = this.getValueAsArray();
this.subFormDefaultValues.forEach(({index, values}) => {
const newValue = flat ? values.flat : {...values};
this.subFormDefaultValues = this.subFormDefaultValues.map(
({index, values, setted}) => {
const newValue = flat ? values.flat : {...values};
if (!isObjectShallowModified(value[index], newValue)) {
return;
if (!setted && isObjectShallowModified(value[index], newValue)) {
value[index] = flat ? values.flat : {...values};
}
return {
index,
values,
setted: true
};
}
value[index] = flat ? values.flat : {...values};
});
);
if (flat && joinValues) {
value = value.join(delimiter || ',');
}
this.props.setPrinstineValue(value);
formInited ? onChange(value) : setPrinstineValue(value);
}
handleSingleFormInit(values: any) {
@ -461,6 +477,7 @@ export default class ComboControl extends React.Component<ComboProps> {
this.subForms[index] = ref;
} else {
this.subForms.splice(index, 1);
this.subFormDefaultValues.splice(index, 1);
}
}
@ -688,11 +705,13 @@ export default class ComboControl extends React.Component<ComboProps> {
index,
disabled,
data,
onChange: this.handleChange.bind(this, index),
onInit: this.handleFormInit.bind(this, index),
onChange: this.handleChange,
onInit: this.handleFormInit,
onAction: this.handleAction,
ref: (ref: any) => this.formRef(ref, index),
canAccessSuperData
canAccessSuperData,
value: undefined,
formItemValue: undefined
}
)
) : (
@ -857,11 +876,13 @@ export default class ComboControl extends React.Component<ComboProps> {
index,
disabled,
data,
onChange: this.handleChange.bind(this, index),
onInit: this.handleFormInit.bind(this, index),
onChange: this.handleChange,
onInit: this.handleFormInit,
onAction: this.handleAction,
ref: (ref: any) => this.formRef(ref, index),
canAccessSuperData
canAccessSuperData,
value: undefined,
formItemValue: undefined
}
)
) : (

6
src/renderers/Form/Item.tsx
View File

@ -50,7 +50,11 @@ export interface FormItemProps extends RendererProps {
value: any;
prinstine: any;
setPrinstineValue: (value: any) => void;
onChange: (value: any, submitOnChange?: boolean) => void;
onChange: (
value: any,
submitOnChange?: boolean,
changeImmediately?: boolean
) => void;
onBulkChange: (
values: {[propName: string]: any},
submitOnChange?: boolean

14
src/renderers/Form/Tabs.tsx
View File

@ -20,7 +20,7 @@ export class TabsRenderer extends React.Component<TabsProps, any> {
this.renderTab = this.renderTab.bind(this);
}
renderTab(tab: any, {key}: any) {
renderTab(tab: any, props: any, key: number) {
const {
renderFormItems,
formMode,
@ -37,10 +37,14 @@ export class TabsRenderer extends React.Component<TabsProps, any> {
) {
return (
<div className={cx(`Form--${tab.mode || formMode || 'normal'}`)}>
{renderFormItems(tab, ($path as string).replace(/^.*form\//, ''), {
mode: tab.mode || formMode,
horizontal: tab.horizontal || formHorizontal
})}
{renderFormItems(
tab,
`${($path as string).replace(/^.*form\//, '')}/${key}`,
{
mode: tab.mode || formMode,
horizontal: tab.horizontal || formHorizontal
}
)}
</div>
);
}

9
src/renderers/Form/index.tsx
View File

@ -86,10 +86,10 @@ export interface FormProps extends RendererProps, FormSchema {
persistData: boolean; // 开启本地缓存
clearPersistDataAfterSubmit: boolean; // 提交成功后清空本地缓存
trimValues?: boolean;
onInit?: (values: object) => any;
onInit?: (values: object, props:any) => any;
onReset?: (values: object) => void;
onSubmit?: (values: object, action: any) => any;
onChange?: (values: object, diff: object) => any;
onChange?: (values: object, diff: object, props:any) => any;
onFailed?: (reason: string, errors: any) => any;
onFinished: (values: object, action: any) => any;
onValidate: (values: object, form: any) => any;
@ -325,7 +325,7 @@ export default class Form extends React.Component<FormProps, object> {
const hooks: Array<(data: any) => Promise<any>> = this.hooks['init'] || [];
await Promise.all(hooks.map(hook => hook(data)));
onInit && onInit(extendObject(store.data, data));
onInit && onInit(extendObject(store.data, data), this.props);
submitOnInit &&
this.handleAction(
@ -467,7 +467,7 @@ export default class Form extends React.Component<FormProps, object> {
handleChange(value: any, name: string, submit: boolean) {
const {onChange, store, submitOnChange} = this.props;
onChange && onChange(store.data, difference(store.data, store.pristine));
onChange && onChange(store.data, difference(store.data, store.pristine), this.props);
(submit || submitOnChange) &&
this.handleAction(
@ -949,6 +949,7 @@ export default class Form extends React.Component<FormProps, object> {
affixFooter,
mode
} = this.props;
const WrapperComponent =
this.props.wrapperComponent ||
(/(?:\/|^)form\//.test($path as string) ? 'div' : 'form');

8
src/renderers/Tabs.tsx
View File

@ -26,13 +26,13 @@ export interface TabProps extends Schema {
export interface TabsProps extends RendererProps {
mode?: '' | 'line' | 'card' | 'radio' | 'vertical';
tabsMode?: '' | 'line' | 'card' | 'radio' | 'vertical';
activeKey: string | number;
contentClassName: string;
activeKey?: string | number;
contentClassName?: string;
location?: any;
mountOnEnter?: boolean;
unmountOnExit?: boolean;
tabs?: Array<TabProps>;
tabRender?: (tab: TabProps, props?: TabsProps) => JSX.Element;
tabRender?: (tab: TabProps, props: TabsProps, index: number) => JSX.Element;
}
export interface TabsState {
@ -248,7 +248,7 @@ export default class Tabs extends React.Component<TabsProps, TabsState> {
}
>
{tabRender
? tabRender(tab, this.props)
? tabRender(tab, this.props, index)
: render(`tab/${index}`, tab.tab || tab.body || '')}
</Tab>
) : null

3
src/store/formItem.ts
View File

@ -599,7 +599,8 @@ export const FormItemStore = types
setSubStore,
reset,
openDialog,
closeDialog
closeDialog,
beforeDetach: () => self.getSelectedOptions.cache.clear!()
};
});