github/lowcode-engine
1
0
Fork 0
mirror of https://github.com/alibaba/lowcode-engine.git synced 2026-01-20 15:38:32 +00:00
Code Issues Packages Projects Releases Wiki Activity

Merge commit '13424f12649d3d26cbbe12ae2206a5382f9f3e77' into def_releases_2022040810384040_ali-lowcode_ali-lowcode-engine/1.0.81

Browse Source
This commit is contained in:
tbfed 2022-04-14 16:45:44 +08:00
commit b50219d9a4
1 changed files with 65 additions and 43 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

48
packages/react-simulator-renderer/src/renderer.ts
View File

@ -19,7 +19,13 @@ import {
} from '@ali/lowcode-utils'; } from '@ali/lowcode-utils';
import { ComponentSchema, TransformStage, NodeSchema } from '@ali/lowcode-types'; import { ComponentSchema, TransformStage, NodeSchema } from '@ali/lowcode-types';
// just use types // just use types
import { BuiltinSimulatorRenderer, NodeInstance, Component, DocumentModel, Node } from '@ali/lowcode-designer'; import {
BuiltinSimulatorRenderer,
NodeInstance,
Component,
DocumentModel,
Node,
} from '@ali/lowcode-designer';
import LowCodeRenderer from '@ali/lowcode-react-renderer'; import LowCodeRenderer from '@ali/lowcode-react-renderer';
import { createMemoryHistory, MemoryHistory } from 'history'; import { createMemoryHistory, MemoryHistory } from 'history';
import Slot from './builtin-components/slot'; import Slot from './builtin-components/slot';
@ -196,7 +202,7 @@ export class DocumentInstance {
} }
dispose() { dispose() {
this.disposeFunctions.forEach(fn => fn()); this.disposeFunctions.forEach((fn) => fn());
this.instancesMap = new Map(); this.instancesMap = new Map();
} }
} }
@ -215,12 +221,16 @@ export class SimulatorRendererContainer implements BuiltinSimulatorRenderer {
makeObservable(this); makeObservable(this);
this.autoRender = host.autoRender; this.autoRender = host.autoRender;
this.disposeFunctions.push(host.connect(this, () => { this.disposeFunctions.push(
host.connect(this, () => {
// sync layout config // sync layout config
this._layout = host.project.get('config').layout; this._layout = host.project.get('config').layout;
// todo: split with others, not all should recompute // todo: split with others, not all should recompute
if (this._libraryMap !== host.libraryMap || this._componentsMap !== host.designer.componentsMap) { if (
this._libraryMap !== host.libraryMap ||
this._componentsMap !== host.designer.componentsMap
) {
this._libraryMap = host.libraryMap || {}; this._libraryMap = host.libraryMap || {};
this._componentsMap = host.designer.componentsMap; this._componentsMap = host.designer.componentsMap;
this.buildComponents(); this.buildComponents();
@ -236,11 +246,13 @@ export class SimulatorRendererContainer implements BuiltinSimulatorRenderer {
// sync device // sync device
this._device = host.device; this._device = host.device;
})); }),
);
const documentInstanceMap = new Map<string, DocumentInstance>(); const documentInstanceMap = new Map<string, DocumentInstance>();
let initialEntry = '/'; let initialEntry = '/';
let firstRun = true; let firstRun = true;
this.disposeFunctions.push(host.autorun(() => { this.disposeFunctions.push(
host.autorun(() => {
this._documentInstances = host.project.documents.map((doc) => { this._documentInstances = host.project.documents.map((doc) => {
let inst = documentInstanceMap.get(doc.id); let inst = documentInstanceMap.get(doc.id);
if (!inst) { if (!inst) {
@ -258,7 +270,8 @@ export class SimulatorRendererContainer implements BuiltinSimulatorRenderer {
} else if (this.history.location.pathname !== path) { } else if (this.history.location.pathname !== path) {
this.history.replace(path); this.history.replace(path);
} }
})); }),
);
const history = createMemoryHistory({ const history = createMemoryHistory({
initialEntries: [initialEntry], initialEntries: [initialEntry],
}); });
@ -327,7 +340,11 @@ export class SimulatorRendererContainer implements BuiltinSimulatorRenderer {
private _libraryMap: { [key: string]: string } = {}; private _libraryMap: { [key: string]: string } = {};
private buildComponents() { private buildComponents() {
this._components = buildComponents(this._libraryMap, this._componentsMap, this.createComponent.bind(this)); this._components = buildComponents(
this._libraryMap,
this._componentsMap,
this.createComponent.bind(this),
);
this._components = { this._components = {
...builtinComponents, ...builtinComponents,
...this._components, ...this._components,
@ -508,8 +525,8 @@ export class SimulatorRendererContainer implements BuiltinSimulatorRenderer {
} }
dispose() { dispose() {
this.disposeFunctions.forEach(fn => fn()); this.disposeFunctions.forEach((fn) => fn());
this.documentInstances.forEach(docInst => docInst.dispose()); this.documentInstances.forEach((docInst) => docInst.dispose());
untracked(() => { untracked(() => {
this._componentsMap = {}; this._componentsMap = {};
this._components = null; this._components = null;
@ -530,7 +547,9 @@ function cacheReactKey(el: Element): Element {
if (REACT_KEY !== '') { if (REACT_KEY !== '') {
return el; return el;
} }
REACT_KEY = Object.keys(el).find((key) => key.startsWith('__reactInternalInstance$')) || ''; REACT_KEY = Object.keys(el).find(
(key) => key.startsWith('__reactInternalInstance$') || key.startsWith('__reactFiber$'),
);
if (!REACT_KEY && (el as HTMLElement).parentElement) { if (!REACT_KEY && (el as HTMLElement).parentElement) {
return cacheReactKey((el as HTMLElement).parentElement!); return cacheReactKey((el as HTMLElement).parentElement!);
} }
@ -540,7 +559,10 @@ function cacheReactKey(el: Element): Element {
const SYMBOL_VNID = Symbol('_LCNodeId'); const SYMBOL_VNID = Symbol('_LCNodeId');
const SYMBOL_VDID = Symbol('_LCDocId'); const SYMBOL_VDID = Symbol('_LCDocId');
function getClosestNodeInstance(from: ReactInstance, specId?: string): NodeInstance<ReactInstance> | null { function getClosestNodeInstance(
from: ReactInstance,
specId?: string,
): NodeInstance<ReactInstance> | null {
let el: any = from; let el: any = from;
if (el) { if (el) {
if (isElement(el)) { if (isElement(el)) {
@ -599,7 +621,7 @@ function getLowCodeComponentProps(props: any) {
return props; return props;
} }
const newProps: any = {}; const newProps: any = {};
Object.keys(props).forEach(k => { Object.keys(props).forEach((k) => {
if (['children', 'componentId', '__designMode', '_componentName', '_leaf'].includes(k)) { if (['children', 'componentId', '__designMode', '_componentName', '_leaf'].includes(k)) {
return; return;
} }