github/lowcode-engine
1
0
Fork 0
mirror of https://github.com/alibaba/lowcode-engine.git synced 2026-01-19 14:04:28 +00:00
Code Issues Packages Projects Releases Wiki Activity

Merge branch 'fix/filter-bug' into 'release/0.9.0'

Browse Source 
refactor: 低代码组件渲染逻辑重构



See merge request !911674
This commit is contained in:
康为 2020-07-28 22:36:51 +08:00
commit 0891697285
1 changed files with 13 additions and 26 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -213,21 +213,21 @@ export class SimulatorRenderer implements BuiltinSimulatorRenderer {
} }
createComponent(schema: ComponentSchema): Component | null { createComponent(schema: ComponentSchema): Component | null {
const _schema = { let _schema: any = {
...schema, ...schema,
}; };
_schema.methods = {}; _schema.methods = {};
_schema.lifeCycles = {}; _schema.lifeCycles = {};
const processPropsSchema = (propsSchema: any, propsMap: any, node: any): any => { const node = host.document.createNode(_schema);
_schema = node.export(TransformStage.Render);
const processPropsSchema = (propsSchema: any, propsMap: any): any => {
if (!propsSchema) { if (!propsSchema) {
return {}; return {};
} }
let result = { ...propsSchema }; let result = { ...propsSchema };
result = host.document.designer.transformProps(result, node, TransformStage.Init);
result = host.document.designer.transformProps(result, node, TransformStage.Upgrade);
const reg = /^(?:this\.props|props)\.(\S+)$/; const reg = /^(?:this\.props|props)\.(\S+)$/;
Object.keys(result).map((key: string) => { Object.keys(result).map((key: string) => {
if (result[key].type === 'JSExpression') { if (result[key].type === 'JSExpression') {
@ -237,10 +237,12 @@ export class SimulatorRenderer implements BuiltinSimulatorRenderer {
const propName = matched[1]; const propName = matched[1];
result[key] = propsMap[propName]; result[key] = propsMap[propName];
} }
} else if (result[key].type === 'JSSlot') {
const schema = result[key].value;
result[key] = createElement(Ele, {schema, propsMap: {}});
} }
}); });
result = host.document.designer.transformProps(result, node, TransformStage.Render);
return result; return result;
}; };
@ -249,8 +251,6 @@ export class SimulatorRenderer implements BuiltinSimulatorRenderer {
class Ele extends React.Component<{ schema: any, propsMap: any }> { class Ele extends React.Component<{ schema: any, propsMap: any }> {
private isModal: boolean; private isModal: boolean;
private node: any;
private renderProps: any;
constructor(props: any){ constructor(props: any){
super(props); super(props);
@ -259,20 +259,6 @@ export class SimulatorRenderer implements BuiltinSimulatorRenderer {
this.isModal = true; this.isModal = true;
return; return;
} }
this.node = host.document.createNode(props.schema);
this.renderProps = processPropsSchema(props.schema.props, props.propsMap, this.node);
}
shouldComponentUpdate(nextProps: any) {
if (this.isModal) {
return false;
}
const renderProps = processPropsSchema(nextProps.schema.props, nextProps.propsMap, this.node);
if (renderProps && this.renderProps && JSON.stringify({...renderProps, fieldId: ''}) === JSON.stringify({...this.renderProps, fieldId: ''})) {
return false;
}
this.renderProps = renderProps;
return true;
} }
render() { render() {
@ -280,23 +266,24 @@ export class SimulatorRenderer implements BuiltinSimulatorRenderer {
return null; return null;
} }
const { schema, propsMap } = this.props; const { schema, propsMap } = this.props;
const { node } = this;
const Com = componentsMap[schema.componentName]; const Com = componentsMap[schema.componentName];
let children = null; let children = null;
if (schema.children && schema.children.length > 0) { if (schema.children && schema.children.length > 0) {
children = schema.children.map((item: any) => createElement(Ele, {schema: item, propsMap})); children = schema.children.map((item: any) => createElement(Ele, {schema: item, propsMap}));
} }
const props = processPropsSchema(schema.props, propsMap);
const _leaf = host.document.createNode(schema);
return createElement(Com, { ...this.renderProps, _leaf: node }, children); return createElement(Com, {...props, _leaf}, children);
} }
} }
class Com extends React.Component { class Com extends React.Component {
render() { render() {
let children = null; let children = [];
const propsMap = this.props; const propsMap = this.props;
if (_schema.children && Array.isArray(_schema.children)) { if (_schema.children && Array.isArray(_schema.children)) {
children = _schema.children?.map((item: any) => createElement(Ele, {schema: item, propsMap})); children = _schema.children.map((item: any) => createElement(Ele, {schema: item, propsMap}));
} }
return createElement(React.Fragment, {}, children); return createElement(React.Fragment, {}, children);
} }