mirror of
https://github.com/alibaba/lowcode-engine.git
synced 2026-01-12 17:08:14 +00:00
Merge commit 'f2658e1dc5a90469c500fa1ff037ca5fa07db535' into def_releases_2021092316393939_ali-lowcode_ali-lowcode-engine/1.0.69
This commit is contained in:
tbfed
commit
a3ee8f0527
@ -72,7 +72,6 @@ Object {
|
||||
"hidden": false,
|
||||
"id": "node_k1ow3cbd",
|
||||
"isLocked": false,
|
||||
"loop": undefined,
|
||||
"props": Object {
|
||||
"__slot__action": false,
|
||||
"__slot__content": false,
|
||||
@ -121,7 +120,6 @@ Object {
|
||||
"hidden": false,
|
||||
"id": "node_k1ow3cba",
|
||||
"isLocked": false,
|
||||
"loop": undefined,
|
||||
"props": Object {},
|
||||
"title": "",
|
||||
},
|
||||
@ -144,7 +142,6 @@ Object {
|
||||
"hidden": false,
|
||||
"id": "node_k1ow3cbz",
|
||||
"isLocked": false,
|
||||
"loop": undefined,
|
||||
"props": Object {
|
||||
"__category__": "form",
|
||||
"__style__": Object {},
|
||||
@ -223,7 +220,6 @@ Object {
|
||||
"hidden": false,
|
||||
"id": "node_k1ow3cc1",
|
||||
"isLocked": false,
|
||||
"loop": undefined,
|
||||
"props": Object {
|
||||
"__category__": "form",
|
||||
"__style__": Object {},
|
||||
@ -298,7 +294,6 @@ Object {
|
||||
"hidden": false,
|
||||
"id": "node_k1ow3cc3",
|
||||
"isLocked": false,
|
||||
"loop": undefined,
|
||||
"props": Object {
|
||||
"__category__": "form",
|
||||
"__style__": Object {},
|
||||
@ -373,7 +368,6 @@ Object {
|
||||
"hidden": false,
|
||||
"id": "node_k1ow3cbx",
|
||||
"isLocked": false,
|
||||
"loop": undefined,
|
||||
"props": Object {
|
||||
"__style__": Object {},
|
||||
"colSpan": "",
|
||||
@ -390,7 +384,6 @@ Object {
|
||||
"hidden": false,
|
||||
"id": "node_k1ow3cc2",
|
||||
"isLocked": false,
|
||||
"loop": undefined,
|
||||
"props": Object {
|
||||
"__category__": "form",
|
||||
"__style__": Object {},
|
||||
@ -465,7 +458,6 @@ Object {
|
||||
"hidden": false,
|
||||
"id": "node_k1ow3cc0",
|
||||
"isLocked": false,
|
||||
"loop": undefined,
|
||||
"props": Object {
|
||||
"__category__": "form",
|
||||
"__style__": Object {},
|
||||
@ -560,7 +552,6 @@ Object {
|
||||
"hidden": false,
|
||||
"id": "node_k1ow3cby",
|
||||
"isLocked": false,
|
||||
"loop": undefined,
|
||||
"props": Object {
|
||||
"__style__": Object {},
|
||||
"colSpan": "",
|
||||
@ -575,7 +566,6 @@ Object {
|
||||
"hidden": false,
|
||||
"id": "node_k1ow3cbw",
|
||||
"isLocked": false,
|
||||
"loop": undefined,
|
||||
"props": Object {
|
||||
"__style__": Object {},
|
||||
"columnGap": "20",
|
||||
@ -592,7 +582,6 @@ Object {
|
||||
"hidden": false,
|
||||
"id": "node_k1ow3cbk",
|
||||
"isLocked": false,
|
||||
"loop": undefined,
|
||||
"props": Object {},
|
||||
"title": "",
|
||||
},
|
||||
@ -603,7 +592,6 @@ Object {
|
||||
"hidden": false,
|
||||
"id": "node_k1ow3cbj",
|
||||
"isLocked": false,
|
||||
"loop": undefined,
|
||||
"props": Object {
|
||||
"__slot__extra": false,
|
||||
"__slot__subTitle": false,
|
||||
@ -648,7 +636,6 @@ Object {
|
||||
"hidden": false,
|
||||
"id": "node_k1ow3cc4",
|
||||
"isLocked": false,
|
||||
"loop": undefined,
|
||||
"props": Object {
|
||||
"__category__": "form",
|
||||
"__style__": Object {},
|
||||
@ -727,7 +714,6 @@ Object {
|
||||
"hidden": false,
|
||||
"id": "node_k1ow3cc8",
|
||||
"isLocked": false,
|
||||
"loop": undefined,
|
||||
"props": Object {
|
||||
"__category__": "form",
|
||||
"__style__": Object {},
|
||||
@ -802,7 +788,6 @@ Object {
|
||||
"hidden": false,
|
||||
"id": "node_k1ow3cc6",
|
||||
"isLocked": false,
|
||||
"loop": undefined,
|
||||
"props": Object {
|
||||
"__style__": Object {},
|
||||
"colSpan": "",
|
||||
@ -819,7 +804,6 @@ Object {
|
||||
"hidden": false,
|
||||
"id": "node_k1ow3cc9",
|
||||
"isLocked": false,
|
||||
"loop": undefined,
|
||||
"props": Object {
|
||||
"__category__": "form",
|
||||
"__style__": Object {},
|
||||
@ -894,7 +878,6 @@ Object {
|
||||
"hidden": false,
|
||||
"id": "node_k1ow3cc7",
|
||||
"isLocked": false,
|
||||
"loop": undefined,
|
||||
"props": Object {
|
||||
"__style__": Object {},
|
||||
"colSpan": "",
|
||||
@ -909,7 +892,6 @@ Object {
|
||||
"hidden": false,
|
||||
"id": "node_k1ow3cc5",
|
||||
"isLocked": false,
|
||||
"loop": undefined,
|
||||
"props": Object {
|
||||
"__style__": Object {},
|
||||
"columnGap": "20",
|
||||
@ -926,7 +908,6 @@ Object {
|
||||
"hidden": false,
|
||||
"id": "node_k1ow3cbm",
|
||||
"isLocked": false,
|
||||
"loop": undefined,
|
||||
"props": Object {},
|
||||
"title": "",
|
||||
},
|
||||
@ -937,7 +918,6 @@ Object {
|
||||
"hidden": false,
|
||||
"id": "node_k1ow3cbl",
|
||||
"isLocked": false,
|
||||
"loop": undefined,
|
||||
"props": Object {
|
||||
"__slot__extra": false,
|
||||
"__slot__subTitle": false,
|
||||
@ -980,7 +960,6 @@ Object {
|
||||
"hidden": false,
|
||||
"id": "node_k1ow3cbn",
|
||||
"isLocked": false,
|
||||
"loop": undefined,
|
||||
"props": Object {
|
||||
"__style__": ":root {
|
||||
margin-right: 16px;
|
||||
@ -1025,7 +1004,6 @@ Object {
|
||||
"hidden": false,
|
||||
"id": "node_k1ow3cbp",
|
||||
"isLocked": false,
|
||||
"loop": undefined,
|
||||
"props": Object {
|
||||
"__style__": ":root {
|
||||
width: 80px;
|
||||
@ -1063,7 +1041,6 @@ Object {
|
||||
"hidden": false,
|
||||
"id": "node_k1ow3cbo",
|
||||
"isLocked": false,
|
||||
"loop": undefined,
|
||||
"props": Object {
|
||||
"__style__": ":root {
|
||||
display: flex;
|
||||
@ -1089,7 +1066,6 @@ Object {
|
||||
"hidden": false,
|
||||
"id": "form",
|
||||
"isLocked": false,
|
||||
"loop": undefined,
|
||||
"props": Object {
|
||||
"__style__": Object {},
|
||||
"autoUnmount": true,
|
||||
@ -1120,7 +1096,6 @@ Object {
|
||||
"hidden": false,
|
||||
"id": "node_k1ow3cbb",
|
||||
"isLocked": false,
|
||||
"loop": undefined,
|
||||
"props": Object {
|
||||
"contentBgColor": "transparent",
|
||||
"contentMargin": "20",
|
||||
@ -1135,7 +1110,6 @@ Object {
|
||||
"hidden": false,
|
||||
"id": "node_k1ow3cbc",
|
||||
"isLocked": false,
|
||||
"loop": undefined,
|
||||
"props": Object {},
|
||||
"title": "",
|
||||
},
|
||||
@ -1203,7 +1177,6 @@ Object.keys(module.exports).forEach(function(item) {
|
||||
"type": "js",
|
||||
},
|
||||
},
|
||||
"loop": undefined,
|
||||
"methods": Object {
|
||||
"__initMethods__": Object {
|
||||
"compiled": "function (exports, module) { /*set actions code here*/ }",
|
||||
|
||||
@ -16,9 +16,8 @@ import {
|
||||
isPlainObject,
|
||||
AssetLoader,
|
||||
getProjectUtils,
|
||||
applyActivities,
|
||||
} from '@ali/lowcode-utils';
|
||||
import { RootSchema, ComponentSchema, TransformStage, NodeSchema, ActivityType, ActivityData } from '@ali/lowcode-types';
|
||||
import { ComponentSchema, TransformStage, NodeSchema } from '@ali/lowcode-types';
|
||||
// just use types
|
||||
import { BuiltinSimulatorRenderer, NodeInstance, Component, DocumentModel, Node } from '@ali/lowcode-designer';
|
||||
import LowCodeRenderer from '@ali/lowcode-react-renderer';
|
||||
@ -28,8 +27,6 @@ import Leaf from './builtin-components/leaf';
|
||||
import { withQueryParams, parseQuery } from './utils/url';
|
||||
|
||||
const loader = new AssetLoader();
|
||||
const DELAY_THRESHOLD = 10;
|
||||
const FULL_RENDER_THRESHOLD = 500;
|
||||
configure({ enforceActions: 'never' });
|
||||
|
||||
export class DocumentInstance {
|
||||
@ -447,16 +444,11 @@ export class SimulatorRendererContainer implements BuiltinSimulatorRenderer {
|
||||
|
||||
class LowCodeComp extends React.Component<any, any> {
|
||||
render() {
|
||||
const newSchema = host.designer.transformProps(_schema as any, {
|
||||
componentMeta: {
|
||||
prototype: 'lowcodeComp',
|
||||
},
|
||||
isRoot: () => false,
|
||||
} as Node, TransformStage.Render);
|
||||
const extraProps = getLowCodeComponentProps(this.props);
|
||||
return createElement(LowCodeRenderer, {
|
||||
...extraProps, // 防止覆盖下面内置属性
|
||||
schema: newSchema,
|
||||
// 使用 _schema 为了使低代码组件在页面设计中使用变量，同 react 组件使用效果一致
|
||||
schema: _schema,
|
||||
components: renderer.components,
|
||||
designMode: renderer.designMode,
|
||||
device: renderer.device,
|
||||
|
||||
@ -26,7 +26,6 @@ export type IComponentHoc = {
|
||||
};
|
||||
|
||||
export type IComponentConstruct = (Comp: types.IBaseRenderer, info: IComponentHocInfo) => types.Constructor;
|
||||
|
||||
// const whitelist: string[] = [];
|
||||
|
||||
interface IProps {
|
||||
@ -50,6 +49,63 @@ enum RerenderType {
|
||||
I18nChanged = 'I18nChanged',
|
||||
}
|
||||
|
||||
// 缓存 Leaf 层组件，防止重新渲染问题
|
||||
const leafComponentCache: {
|
||||
[componentName: string]: any;
|
||||
} = {};
|
||||
// 缓存导致 rerender 的订阅事件
|
||||
const rerenderEventCache: {
|
||||
[componentId: string]: any;
|
||||
} = {};
|
||||
|
||||
/** 部分没有渲染的 node 节点进行兜底处理 or 渲染方式没有渲染 LeafWrapper */
|
||||
function makeRerenderEvent({
|
||||
schema,
|
||||
__debug,
|
||||
container,
|
||||
getNode,
|
||||
}: any) {
|
||||
const leaf = getNode?.(schema.id);
|
||||
if (!leaf
|
||||
|| rerenderEventCache[schema.id]?.clear
|
||||
|| leaf === rerenderEventCache[schema.id]?.leaf
|
||||
) {
|
||||
return;
|
||||
}
|
||||
rerenderEventCache[schema.id]?.dispose.forEach((d: any) => d && d());
|
||||
rerenderEventCache[schema.id] = {
|
||||
clear: false,
|
||||
leaf,
|
||||
dispose: [
|
||||
leaf?.onPropChange?.(() => {
|
||||
__debug(`${schema.componentName}[${schema.id}] leaf not render in SimulatorRendererView, leaf onPropsChange make rerender`);
|
||||
container.rerender();
|
||||
}),
|
||||
leaf?.onChildrenChange?.(() => {
|
||||
__debug(`${schema.componentName}[${schema.id}] leaf not render in SimulatorRendererView, leaf onChildrenChange make rerender`);
|
||||
container.rerender();
|
||||
}) as Function,
|
||||
leaf?.onVisibleChange?.(() => {
|
||||
__debug(`${schema.componentName}[${schema.id}] leaf not render in SimulatorRendererView, leaf onVisibleChange make rerender`);
|
||||
container.rerender();
|
||||
}),
|
||||
],
|
||||
};
|
||||
}
|
||||
|
||||
/** 渲染的 node 节点全局注册事件清除 */
|
||||
function clearRerenderEvent(id: string): void {
|
||||
if (!rerenderEventCache[id]) {
|
||||
rerenderEventCache[id] = {
|
||||
clear: true,
|
||||
};
|
||||
return;
|
||||
}
|
||||
rerenderEventCache[id].dispose.forEach((d: any) => d && d());
|
||||
rerenderEventCache[id].dispose = [];
|
||||
rerenderEventCache[id].clear = true;
|
||||
}
|
||||
|
||||
// 给每个组件包裹一个 HOC Leaf，支持组件内部属性变化，自响应渲染
|
||||
export function leafWrapper(Comp: types.IBaseRenderer, {
|
||||
schema,
|
||||
@ -72,16 +128,15 @@ export function leafWrapper(Comp: types.IBaseRenderer, {
|
||||
console.error(`${schema.componentName} component may be has errors: `, Comp);
|
||||
}
|
||||
|
||||
/** 部分没有渲染的 node 节点进行兜底处理 or 渲染方式没有渲染 LeafWrapper */
|
||||
let wrapDisposeFunctions: Function[] = [];
|
||||
if (getNode) {
|
||||
const leaf = getNode(schema.id);
|
||||
makeRerenderEvent({
|
||||
schema,
|
||||
__debug,
|
||||
container,
|
||||
getNode,
|
||||
});
|
||||
|
||||
wrapDisposeFunctions = [
|
||||
leaf?.onPropsChange?.(() => container.rerender()),
|
||||
leaf?.onChildrenChange?.(() => container.rerender()),
|
||||
leaf?.onVisibleChange?.(() => container.rerender()),
|
||||
];
|
||||
if (leafComponentCache[schema.componentName]) {
|
||||
return leafComponentCache[schema.componentName];
|
||||
}
|
||||
|
||||
class LeafWrapper extends Component {
|
||||
@ -94,6 +149,8 @@ export function leafWrapper(Comp: types.IBaseRenderer, {
|
||||
|
||||
disposeFunctions: ((() => void) | Function)[] = [];
|
||||
|
||||
__component_tag = 'leafWrapper';
|
||||
|
||||
recordTime = () => {
|
||||
if (!this.recordInfo.startTime) {
|
||||
return;
|
||||
@ -117,10 +174,11 @@ export function leafWrapper(Comp: types.IBaseRenderer, {
|
||||
constructor(props: IProps, context: any) {
|
||||
super(props, context);
|
||||
// 监听以下事件，当变化时更新自己
|
||||
clearRerenderEvent(schema.id);
|
||||
this.initOnPropsChangeEvent();
|
||||
this.initOnChildrenChangeEvent();
|
||||
this.initOnVisibleChangeEvent();
|
||||
wrapDisposeFunctions.forEach(d => d && d());
|
||||
__debug(`${schema.componentName}[${schema.id}] leaf render in SimulatorRendererView`);
|
||||
this.state = {
|
||||
nodeChildren: null,
|
||||
childrenInState: false,
|
||||
@ -324,5 +382,7 @@ export function leafWrapper(Comp: types.IBaseRenderer, {
|
||||
|
||||
LeafWrapper.displayName = (Comp as any).displayName;
|
||||
|
||||
leafComponentCache[schema.componentName] = LeafWrapper;
|
||||
|
||||
return LeafWrapper;
|
||||
}
|
||||
@ -62,8 +62,6 @@ export default function baseRenererFactory() {
|
||||
|
||||
static contextType = AppContext;
|
||||
|
||||
__hoc_components: any = {};
|
||||
|
||||
__namespace = 'base';
|
||||
|
||||
_self: any = null;
|
||||
@ -481,28 +479,20 @@ export default function baseRenererFactory() {
|
||||
props: transformArrayToMap(componentInfo.props, 'name'),
|
||||
}) || {};
|
||||
|
||||
if (!this.__hoc_components[schema.componentName]) {
|
||||
this.componentHoc.forEach((ComponentConstruct: IComponentConstruct) => {
|
||||
Comp = ComponentConstruct(Comp, {
|
||||
schema,
|
||||
componentInfo,
|
||||
baseRenderer: this,
|
||||
});
|
||||
this.componentHoc.forEach((ComponentConstruct: IComponentConstruct) => {
|
||||
Comp = ComponentConstruct(Comp, {
|
||||
schema,
|
||||
componentInfo,
|
||||
baseRenderer: this,
|
||||
});
|
||||
}
|
||||
});
|
||||
|
||||
// 对于可以获取到ref的组件做特殊处理
|
||||
if (!acceptsRef(Comp) && !this.__hoc_components[schema.componentName]) {
|
||||
if (!acceptsRef(Comp)) {
|
||||
Comp = compWrapper(Comp);
|
||||
components[schema.componentName] = Comp;
|
||||
}
|
||||
|
||||
if (!this.__hoc_components[schema.componentName]) {
|
||||
this.__hoc_components[schema.componentName] = Comp;
|
||||
} else {
|
||||
Comp = this.__hoc_components[schema.componentName];
|
||||
}
|
||||
|
||||
otherProps.ref = (ref: any) => {
|
||||
this.$(props.fieldId || props.ref, ref); // 收集ref
|
||||
const refProps = props.ref;
|
||||
@ -824,18 +814,13 @@ export default function baseRenererFactory() {
|
||||
};
|
||||
|
||||
__getHocComp(Comp: any, schema: any) {
|
||||
if (!this.__hoc_components[schema.componentName]) {
|
||||
this.componentHoc.forEach((ComponentConstruct: IComponentConstruct) => {
|
||||
Comp = ComponentConstruct(Comp || Div, {
|
||||
schema,
|
||||
componentInfo: {},
|
||||
baseRenderer: this,
|
||||
});
|
||||
this.componentHoc.forEach((ComponentConstruct: IComponentConstruct) => {
|
||||
Comp = ComponentConstruct(Comp || Div, {
|
||||
schema,
|
||||
componentInfo: {},
|
||||
baseRenderer: this,
|
||||
});
|
||||
this.__hoc_components[schema.componentName] = Comp;
|
||||
} else {
|
||||
Comp = this.__hoc_components[schema.componentName];
|
||||
}
|
||||
});
|
||||
|
||||
return Comp;
|
||||
}
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user