diff --git a/package.json b/package.json index 7c5983a39..ac1ca5168 100644 --- a/package.json +++ b/package.json @@ -13,7 +13,7 @@ "build": "./scripts/build.sh", "clean": "rm -rf ./packages/*/lib ./packages/*/es ./packages/*/dist ./packages/*/build", "commit": "git-cz", - "pub": "lerna publish --force-publish --cd-version major", + "pub": "lerna publish --force-publish --cd-version prepatch", "setup": "./scripts/setup.sh", "start": "./scripts/start.sh", "start:server": "./scripts/start-server.sh", diff --git a/packages/react-renderer/package.json b/packages/react-renderer/package.json index 556e29f2b..0c31ee3e8 100644 --- a/packages/react-renderer/package.json +++ b/packages/react-renderer/package.json @@ -53,5 +53,5 @@ "publishConfig": { "registry": "http://registry.npm.alibaba-inc.com" }, - "homepage": "https://unpkg.alibaba-inc.com/@ali/lowcode-react-renderer@1.0.4-0/build/index.html" + "homepage": "https://unpkg.alibaba-inc.com/@ali/lowcode-react-renderer@1.0.5-0/build/index.html" } diff --git a/packages/react-renderer/src/renderer/base.jsx b/packages/react-renderer/src/renderer/base.jsx index 37e0f4e39..2e17720ac 100644 --- a/packages/react-renderer/src/renderer/base.jsx +++ b/packages/react-renderer/src/renderer/base.jsx @@ -34,6 +34,7 @@ let scopeIdx = 0; export default class BaseRender extends PureComponent { static dislayName = 'base-renderer'; + static propTypes = { locale: PropTypes.string, messages: PropTypes.object, @@ -42,9 +43,11 @@ export default class BaseRender extends PureComponent { __ctx: PropTypes.object, __schema: PropTypes.object, }; + static defaultProps = { __schema: {}, }; + static contextType = AppContext; constructor(props, context) { @@ -78,8 +81,7 @@ export default class BaseRender extends PureComponent { console.warn(e); } - reloadDataSource = () => { - return new Promise((resolve, reject) => { + reloadDataSource = () => new Promise((resolve, reject) => { debug('reload data source'); if (!this.__dataHelper) { this.__showPlaceholder = false; @@ -103,7 +105,6 @@ export default class BaseRender extends PureComponent { reject(err); }); }); - }; __setLifeCycleMethods = (method, args) => { const lifeCycleMethods = getValue(this.props.__schema, 'lifeCycles', {}); @@ -128,8 +129,8 @@ export default class BaseRender extends PureComponent { __bindCustomMethods = (props = this.props) => { const { __schema } = props; const customMethodsList = Object.keys(__schema.methods || {}) || []; - this.__customMethodsList && - this.__customMethodsList.forEach((item) => { + this.__customMethodsList + && this.__customMethodsList.forEach((item) => { if (!customMethodsList.includes(item)) { delete this[item]; } @@ -171,16 +172,16 @@ export default class BaseRender extends PureComponent { this.__dataHelper = new DataHelper(this, dataSource, appHelper, (config) => this.__parseData(config)); this.dataSourceMap = this.__dataHelper.dataSourceMap; // 设置容器组件占位,若设置占位则在初始异步请求完成之前用loading占位且不渲染容器组件内部内容 - this.__showPlaceholder = - this.__parseData(schema.props && schema.props.autoLoading) && - (dataSource.list || []).some((item) => !!this.__parseData(item.isInit)); + this.__showPlaceholder = this.__parseData(schema.props && schema.props.autoLoading) && (dataSource.list || []).some( + (item) => !!this.__parseData(item.isInit), + ); }; __render = () => { const schema = this.props.__schema; this.__setLifeCycleMethods('render'); - const engine = this.context.engine; + const { engine } = this.context; if (engine) { engine.props.onCompGetCtx(schema, this); // 画布场景才需要每次渲染bind自定义方法 @@ -201,7 +202,7 @@ export default class BaseRender extends PureComponent { } if (!schema.children) return schema.props.children; if (!schema.props.children) return schema.children; - var _children = [].concat(schema.children); + let _children = [].concat(schema.children); if (Array.isArray(schema.props.children)) { _children = _children.concat(schema.props.children); } else { @@ -214,7 +215,7 @@ export default class BaseRender extends PureComponent { const { __schema, __ctx, __components = {} } = this.props; const self = {}; self.__proto__ = __ctx || this; - let _children = this.getSchemaChildren(__schema); + const _children = this.getSchemaChildren(__schema); return this.__createVirtualDom(_children, self, { schema: __schema, Comp: __components[__schema.componentName], @@ -230,8 +231,7 @@ export default class BaseRender extends PureComponent { const { engine } = this.context || {}; try { if (!schema) return null; - const { __appHelper: appHelper, __components: components = {} } = - this.props || {}; + const { __appHelper: appHelper, __components: components = {} } = this.props || {}; if (isJSExpression(schema)) { return parseExpression(schema, self); @@ -245,15 +245,13 @@ export default class BaseRender extends PureComponent { } if (Array.isArray(schema)) { if (schema.length === 1) return this.__createVirtualDom(schema[0], self, parentInfo); - return schema.map((item, idx) => - this.__createVirtualDom(item, self, parentInfo, item && item.__ctx && item.__ctx.lunaKey ? '' : idx), - ); + return schema.map((item, idx) => this.__createVirtualDom(item, self, parentInfo, item && item.__ctx && item.__ctx.lunaKey ? '' : idx),); } // FIXME const _children = this.getSchemaChildren(schema); - //解析占位组件 + // 解析占位组件 if (schema.componentName === 'Flagment' && _children) { - let tarChildren = isJSExpression(_children) ? parseExpression(_children, self) : _children; + const tarChildren = isJSExpression(_children) ? parseExpression(_children, self) : _children; return this.__createVirtualDom(tarChildren, self, parentInfo); } @@ -269,7 +267,7 @@ export default class BaseRender extends PureComponent { if (schema.loop != null) { const loop = parseData(schema.loop, self); - if (Array.isArray(loop) && loop.length > 0 || isJSExpression(loop)) { + if ((Array.isArray(loop) && loop.length > 0) || isJSExpression(loop)) { return this.__createLoopVirtualDom( { ...schema, @@ -315,16 +313,17 @@ export default class BaseRender extends PureComponent { // 容器类组件的上下文通过props传递,避免context传递带来的嵌套问题 const otherProps = isFileSchema(schema) ? { - __schema: schema, - __appHelper: appHelper, - __components: components, - } + __schema: schema, + __appHelper: appHelper, + __components: components, + } : {}; if (engine && engine.props.designMode) { otherProps.__designMode = engine.props.designMode; } const componentInfo = {}; - const props = this.__parseProps(schema.props, self, '', { + const props = + this.__parseProps(schema.props, self, '', { schema, Comp, componentInfo: { @@ -361,30 +360,22 @@ export default class BaseRender extends PureComponent { if (!props.key) { props.key = props.__id; } - const renderComp = (props) => { - return engine.createElement( - Comp, - props, -<<<<<<< HEAD:packages/react-renderer/src/renderer/base.jsx - (!isFileSchema(schema) && - !!_children && -======= - (!!schema.children && ->>>>>>> master:packages/react-renderer/src/engine/base.jsx - this.__createVirtualDom( - isJSExpression(_children) ? parseExpression(_children, self) : _children, - self, - { - schema, - Comp, - }, - )) || - null, + + let child = null; + if (!isFileSchema(schema) && !!_children) { + child = this.__createVirtualDom( + isJSExpression(_children) ? parseExpression(_children, self) : _children, + self, + { + schema, + Comp, + }, ); - }; - //设计模式下的特殊处理 + } + const renderComp = (props) => engine.createElement(Comp, props, child); + // 设计模式下的特殊处理 if (engine && [DESIGN_MODE.EXTEND, DESIGN_MODE.BORDER].includes(engine.props.designMode)) { - //对于overlay,dialog等组件为了使其在设计模式下显示,外层需要增加一个div容器 + // 对于overlay,dialog等组件为了使其在设计模式下显示,外层需要增加一个div容器 if (OVERLAY_LIST.includes(schema.componentName)) { const { ref, ...overlayProps } = otherProps; return ( @@ -397,7 +388,10 @@ export default class BaseRender extends PureComponent { if (componentInfo && componentInfo.parentRule) { const parentList = componentInfo.parentRule.split(','); const { schema: parentSchema, Comp: parentComp } = parentInfo; - if (!parentList.includes(parentSchema.componentName) || parentComp !== components[parentSchema.componentName]) { + if ( + !parentList.includes(parentSchema.componentName) || + parentComp !== components[parentSchema.componentName] + ) { props.__componentName = schema.componentName; Comp = VisualDom; } else { @@ -458,22 +452,21 @@ export default class BaseRender extends PureComponent { const parseReactNode = (data, params) => { if (isEmpty(params)) { return checkProps(this.__createVirtualDom(data, self, { schema, Comp })); - } else { - return checkProps(function() { - const args = {}; - if (Array.isArray(params) && params.length) { - params.map((item, idx) => { - if (typeof item === 'string') { - args[item] = arguments[idx]; - } else if (item && typeof item === 'object') { - args[item.name] = arguments[idx]; - } - }); - } - args.__proto__ = self; - return self.__createVirtualDom(data, args, { schema, Comp }); - }); } + return checkProps(function() { + const args = {}; + if (Array.isArray(params) && params.length) { + params.map((item, idx) => { + if (typeof item === 'string') { + args[item] = arguments[idx]; + } else if (item && typeof item === 'object') { + args[item.name] = arguments[idx]; + } + }); + } + args.__proto__ = self; + return self.__createVirtualDom(data, args, { schema, Comp }); + }); }; // 判断是否需要解析变量 @@ -504,34 +497,37 @@ export default class BaseRender extends PureComponent { // 兼容通过componentInfo判断的情况 if (isSchema(props)) { const isReactNodeFunction = !!( - propInfo && - propInfo.type === 'ReactNode' && - propInfo.props && - propInfo.props.type === 'function' + propInfo + && propInfo.type === 'ReactNode' + && propInfo.props + && propInfo.props.type === 'function' ); const isMixinReactNodeFunction = !!( - propInfo && - propInfo.type === 'Mixin' && - propInfo.props && - propInfo.props.types && - propInfo.props.types.indexOf('ReactNode') > -1 && - propInfo.props.reactNodeProps && - propInfo.props.reactNodeProps.type === 'function' + propInfo + && propInfo.type === 'Mixin' + && propInfo.props + && propInfo.props.types + && propInfo.props.types.indexOf('ReactNode') > -1 + && propInfo.props.reactNodeProps + && propInfo.props.reactNodeProps.type === 'function' ); return parseReactNode( props, isReactNodeFunction ? propInfo.props.params : isMixinReactNodeFunction - ? propInfo.props.reactNodeProps.params - : null, + ? propInfo.props.reactNodeProps.params + : null, ); - } else if (Array.isArray(props)) { + } + if (Array.isArray(props)) { return checkProps(props.map((item, idx) => this.__parseProps(item, self, path ? `${path}.${idx}` : idx, info))); - } else if (typeof props === 'function') { + } + if (typeof props === 'function') { return checkProps(props.bind(self)); - } else if (props && typeof props === 'object') { + } + if (props && typeof props === 'object') { if (props.$$typeof) return checkProps(props); const res = {}; forEach(props, (val, key) => { @@ -542,7 +538,8 @@ export default class BaseRender extends PureComponent { res[key] = this.__parseProps(val, self, path ? `${path}.${key}` : key, info); }); return checkProps(res); - } else if (typeof props === 'string') { + } + if (typeof props === 'string') { return checkProps(props.trim()); } return checkProps(props); @@ -551,18 +548,23 @@ export default class BaseRender extends PureComponent { get utils() { return this.appHelper && this.appHelper.utils; } + get constants() { return this.appHelper && this.appHelper.constants; } + get history() { return this.appHelper && this.appHelper.history; } + get location() { return this.appHelper && this.appHelper.location; } + get match() { return this.appHelper && this.appHelper.match; } + render() { return null; }