test/amis2
1
0
Fork 0
mirror of https://gitee.com/baidu/amis.git synced 2024-11-29 18:48:45 +08:00
Code Issues Actions 2 Packages Projects Releases Wiki Activity

fix: 修复编辑器模拟数据逻辑导致的组件无限刷新问题 (#10293)

Browse Source
This commit is contained in:
liaoxuezhi 2024-05-22 19:27:07 +08:00 committed by 2betop
parent fb3ce5cf8d
commit 53bac72e06
11 changed files with 149 additions and 94 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
packages/amis-editor/src/plugin/Cards.tsx
View File

@ -562,15 +562,19 @@ export class CardsPlugin extends BasePlugin {
return dataSchema;
}
filterProps(props: any) {
filterProps(props: any, node: EditorNodeType) {
// 编辑时显示两行假数据
const count = (props.columnsCount || 3) * 2;
props.value = repeatArray({}, count).map((item, index) => {
if (!node.state.value) {
node.updateState({
value: repeatArray({}, count).map((item, index) => {
return {
...item,
id: index + 1
};
})
});
}
props.className = `${props.className || ''} ae-Editor-list`;
props.itemsClassName = `${props.itemsClassName || ''} cards-items`;

10
packages/amis-editor/src/plugin/Each.tsx
View File

@ -356,11 +356,17 @@ export class EachPlugin extends BasePlugin {
]);
};
filterProps(props: any) {
filterProps(props: any, node: EditorNodeType) {
// 列表类型内的文本元素显示{{公式}}或者自定义展位，不显示实际值
props = escapeFormula(props);
if (!node.state.value) {
// 循环编辑态显示2个元素
props.value = [{}, {}];
// props.value = [{}, {}];
node.updateState({
value: [{}, {}]
});
}
props.className = `${props.className || ''} ae-Editor-list`;
if (

16
packages/amis-editor/src/plugin/Form/Combo.tsx
View File

@ -707,9 +707,15 @@ export class ComboControlPlugin extends BasePlugin {
]);
};
filterProps(props: any) {
filterProps(props: any, node: EditorNodeType) {
if (!node.state.value) {
// 至少显示一个成员，否则啥都不显示。
if (props.multiple && !props.value && !props.$schema.value && !props.$ref) {
if (
props.multiple &&
!props.value &&
!props.$schema.value &&
!props.$ref
) {
const mockedData = {};
if (Array.isArray(props.items) && props.items.length === 0) {
props.items.forEach((control: any) => {
@ -717,8 +723,10 @@ export class ComboControlPlugin extends BasePlugin {
setVariable(mockedData, control.name, mockValue(control));
});
}
props.value = [mockedData];
return props;
node.updateState({
value: [mockedData]
});
}
}
return props;
}

10
packages/amis-editor/src/plugin/Form/InputArray.tsx
View File

@ -1,5 +1,5 @@
import {Button} from 'amis';
import {registerEditorPlugin} from 'amis-editor-core';
import {EditorNodeType, registerEditorPlugin} from 'amis-editor-core';
import {
BaseEventContext,
BasePlugin,
@ -147,12 +147,14 @@ export class ArrayControlPlugin extends BasePlugin {
];
};
filterProps(props: any) {
filterProps(props: any, node: EditorNodeType) {
props = JSONPipeOut(props);
// 至少显示一个成员，否则啥都不显示。
if (!props.value) {
props.value = [''];
if (!node.state.value && !props.value) {
node.updateState({
value: ['']
});
}
return props;

9
packages/amis-editor/src/plugin/Form/InputSubForm.tsx
View File

@ -102,12 +102,15 @@ export class SubFormControlPlugin extends BasePlugin {
] as SchemaCollection;
};
filterProps(props: any) {
filterProps(props: any, node: EditorNodeType) {
props = JSONPipeOut(props);
// 至少显示一个成员，否则啥都不显示。
if (!props.value) {
props.value = [''];
// 至少显示一个成员，否则啥都不显示。
if (!node.state.value && !props.value) {
node.updateState({
value: ['']
});
}
return props;

10
packages/amis-editor/src/plugin/Form/InputTable.tsx
View File

@ -1411,8 +1411,10 @@ export class TableControlPlugin extends BasePlugin {
]);
};
filterProps(props: any) {
filterProps(props: any, node: EditorNodeType) {
if (!node.state.value) {
const arr = resolveArrayDatasource(props);
let value: Array<any> = [];
/** 可 */
if (!Array.isArray(arr) || !arr.length) {
@ -1427,13 +1429,15 @@ export class TableControlPlugin extends BasePlugin {
});
}
props.value = repeatArray(mockedData, 1).map((item, index) => ({
value = repeatArray(mockedData, 1).map((item, index) => ({
...item,
id: index + 1
}));
} else {
// 只取10条预览，否则太多卡顿
props.value = arr.slice(0, 10);
value = arr.slice(0, 10);
}
node.updateState({value});
}
return {

6
packages/amis-editor/src/plugin/Form/Static.tsx
View File

@ -409,8 +409,10 @@ export class StaticControlPlugin extends BasePlugin {
filterProps(props: any, node: EditorNodeType) {
props.$$id = node.id;
if (typeof props.value === 'undefined') {
props.value = mockValue(props);
if (typeof props.value === 'undefined' && !node.state.value) {
node.updateState({
value: mockValue(props)
});
}
return props;
}

16
packages/amis-editor/src/plugin/List.tsx
View File

@ -191,10 +191,13 @@ export class ListPlugin extends BasePlugin {
]);
};
filterProps(props: any) {
filterProps(props: any, node: EditorNodeType) {
if (!node.state.value) {
if (props.isSlot) {
props.value = [props.data];
return props;
node.updateState({
value: [props.data]
});
return;
}
const data = {
@ -209,10 +212,13 @@ export class ListPlugin extends BasePlugin {
if (!Array.isArray(arr) || !arr.length) {
const mockedData: any = this.buildMockData();
props.value = repeatArray(mockedData, 1).map((item, index) => ({
node.updateState({
value: repeatArray(mockedData, 1).map((item, index) => ({
...item,
id: index + 1
}));
}))
});
}
}
const {$schema, ...rest} = props;

8
packages/amis-editor/src/plugin/List2.tsx
View File

@ -438,15 +438,19 @@ export class List2Plugin extends BasePlugin {
return dataSchema;
}
filterProps(props: any) {
filterProps(props: any, node: EditorNodeType) {
// 编辑时显示两行假数据
const count = (props.columnsCount || 3) * 2;
props.value = repeatArray({}, count).map((item, index) => {
if (!node.state.value) {
node.updateState({
value: repeatArray({}, count).map((item, index) => {
return {
...item,
id: index + 1
};
})
});
}
props.className = `${props.className || ''} ae-Editor-list`;
props.itemsClassName = `${props.itemsClassName || ''} cards-items`;

14
packages/amis-editor/src/plugin/Table.tsx
View File

@ -745,7 +745,8 @@ export class TablePlugin extends BasePlugin {
]);
};
filterProps(props: any) {
filterProps(props: any, node: EditorNodeType) {
if (!node.state.value) {
const arr = resolveArrayDatasource(props);
if (!Array.isArray(arr) || !arr.length) {
@ -759,13 +760,18 @@ export class TablePlugin extends BasePlugin {
});
}
props.value = repeatArray(mockedData, 1).map((item, index) => ({
node.updateState({
value: repeatArray(mockedData, 1).map((item, index) => ({
...item,
id: index + 1
}));
}))
});
} else {
// 只取10条预览，否则太多卡顿
props.value = arr.slice(0, 3);
node.updateState({
value: arr.slice(0, 3)
});
}
}
// 编辑模式，不允许表格调整宽度

12
packages/amis-editor/src/plugin/Table2.tsx
View File

@ -511,7 +511,7 @@ export class Table2Plugin extends BasePlugin {
return super.getRendererInfo(context);
}
filterProps(props: any) {
filterProps(props: any, node: EditorNodeType) {
const arr = resolveArrayDatasource(props);
const getFooterSummary = (text: string) => ({
type: 'alert',
@ -606,6 +606,16 @@ export class Table2Plugin extends BasePlugin {
props.expandable.expandedRowKeys = [1];
}
if (props.value) {
if (!node.state.value) {
node.updateState({
value: props.value
});
}
delete props.value;
}
return props;
}