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

feat: rax render

Browse Source
This commit is contained in:
响指 2020-07-21 15:31:11 +08:00
parent f781ea5f1d
commit 95bf33149d
15 changed files with 415 additions and 111 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
packages/demo/public/index.html
View File

@ -16,7 +16,7 @@
<script src="https://g.alicdn.com/mylib/moment/2.24.0/min/moment.min.js"></script>
<link rel="stylesheet" href="https://alifd.alicdn.com/npm/@alifd/next/1.11.6/next.min.css" />
<script src="https://unpkg.alibaba-inc.com/@alifd/next@1.18.17/dist/next.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/rax@1.1.3/dist/rax.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/rax@1.1.3/dist/rax.js"></script>
<link rel="stylesheet" href="/css/editor-preset-vision.css" />
<script>
window.pageConfig = {

2
packages/demo/public/rax.json
View File

@ -4,7 +4,7 @@
"props": {},
"children": [
{
"componentName": "View",
"componentName": "Container",
"props": {},
"children": [
{

428
packages/demo/public/raxAssets.json
View File

@ -1,83 +1,367 @@
{
"version": "1.0.0",
"externals": [],
"componentDependencies": [{
"prototypeConfigsUrl": ["https://g.alicdn.com/legao-comp/web_bundle_0724/@ali/vc-deep-mobile/2.0.1-beta.4/proto.c0b2ef2.js"],
"prototypeViewsUrl": null,
"alias": "",
"library": "AliVcDiv",
"urls": [
"https://g.alicdn.com/legao-comp/web_bundle_0724/@ali/vc-deep-mobile/2.0.1-beta.4/view.c0b2ef2.css",
"https://g.alicdn.com/legao-comp/web_bundle_0724/@ali/vc-deep-mobile/2.0.1-beta.4/view.c0b2ef2.js"
],
"components": null,
"packageName": "@ali/vc-deep-mobile",
"version": "1.0.1"
}],
"packages": [
"externals": [
{
"title": "view",
"package": "rax-view",
"version": "1.19.18",
"urls": ["https://cdn.jsdelivr.net/npm/rax-view@1.1.2/build/index.js"],
"library": "View"
"urls": ["//g.alicdn.com/platform/c/react/16.5.2/react.min.js"],
"library": "React",
"name": "react",
"version": "16.5.2"
},
{
"title": "view",
"package": "rax-text",
"version": "1.19.18",
"urls": ["https://cdn.jsdelivr.net/npm/rax-text@1.3.1/build/index.js"],
"library": "Text"
"urls": ["//g.alicdn.com/platform/c/react-dom/16.5.2/react-dom.min.js"],
"library": "ReactDOM",
"name": "react-dom",
"version": "16.12.0"
},
{
"urls": ["//g.alicdn.com/platform/c/prop-types/15.6.2/prop-types.js"],
"library": "PropTypes",
"name": "prop-types",
"version": "15.6.2"
},
{ "library": "ReactRouter", "name": "react-router" },
{ "library": "ReactRouterDOM", "name": "react-router-dom" },
{ "library": "Babel", "name": "babel-standalone" },
{ "library": "Recore", "name": "@ali/recore" },
{
"urls": ["https://g.alicdn.com/code/lib/moment.js/2.24.0/moment-with-locales.min.js"],
"library": "moment",
"name": "moment",
"version": "2.24.0"
},
{ "library": "VisualEngine", "name": "engine" },
{ "library": "VisualEngine", "name": "visualengine" },
{ "library": "VisualEngine", "name": "@ali/visualengine" },
{ "library": "VisualEngineUtils", "name": "engine-utils" },
{ "library": "VisualEngineUtils", "name": "@ali/visualengine-utils" },
{ "library": "VisualEngine.ui.Popup", "name": "@ali/ve-popups" },
{ "library": "VisualEngineUtils.FieldControl", "name": "@ali/ve-field" },
{ "library": "VisualEngineUtils.BoolControl", "name": "@ali/ve-bool-control" },
{ "library": "VisualEngineUtils.ChoiceControl", "name": "@ali/ve-choice-control" },
{ "library": "VisualEngineUtils.ColorControl", "name": "@ali/ve-color-control" },
{ "library": "VisualEngineUtils.DateControl", "name": "@ali/ve-date-control" },
{ "library": "VisualEngineUtils.I18nControl", "name": "@ali/ve-i18n-control" },
{ "library": "VisualEngineUtils.NumberControl", "name": "@ali/ve-number-control" },
{ "library": "VisualEngineUtils.SelectControl", "name": "@ali/ve-select-control" },
{ "library": "VisualEngineUtils.SortableControl", "name": "@ali/ve-sortable" },
{ "library": "VisualEngineUtils.TextControl", "name": "@ali/ve-text-control" },
{ "library": "VisualEngineUtils.ImageControl", "name": "@ali/ve-image-control" },
{ "library": "VisualEngineUtils.SearchControl", "name": "@ali/ve-search-control" },
{ "library": "VisualEngineUtils.BoolSetter", "name": "@ali/vs-bool" },
{ "library": "VisualEngineUtils.ChoiceSetter", "name": "@ali/vs-choice" },
{ "library": "VisualEngineUtils.CodeSetter", "name": "@ali/vs-code" },
{ "library": "VisualEngineUtils.ColorSetter", "name": "@ali/vs-color" },
{ "library": "VisualEngineUtils.DateSetter", "name": "@ali/vs-date" },
{ "library": "VisualEngineUtils.I18nSetter", "name": "@ali/vs-i18n" },
{ "library": "VisualEngineUtils.JsonSetter", "name": "@ali/vs-json" },
{ "library": "VisualEngineUtils.ListSetter", "name": "@ali/vs-list" },
{ "library": "VisualEngineUtils.NumberSetter", "name": "@ali/vs-number" },
{ "library": "VisualEngineUtils.OptionsSetter", "name": "@ali/vs-options" },
{ "library": "VisualEngineUtils.SelectSetter", "name": "@ali/vs-select" },
{ "library": "VisualEngineUtils.TextSetter", "name": "@ali/vs-text" },
{ "library": "VisualEngineUtils.ValidationSetter", "name": "@ali/vs-validation" },
{ "library": "VisualEngineUtils.ImageSetter", "name": "@ali/vs-image" },
{ "library": "VisualEngineUtils.StyleSetter", "name": "@ali/vs-style" },
{ "library": "VisualEngineUtils.EventSetter", "name": "@ali/vs-event" },
{ "library": "RenderEngine", "name": "@ali/render-engine" },
{ "library": "Highcharts", "name": "highcharts" },
{ "library": "Object", "name": "highcharts-more" },
{ "library": "Highcharts && window.Highcharts.map", "name": "highcharts/highmaps" },
{ "library": "jQuery", "name": "$" },
{ "library": "jQuery", "name": "jquery" },
{ "library": "_", "name": "lodash" },
{ "library": "nattyFetch", "name": "natty-fetch" },
{ "library": "nattyFetch", "name": "natty-fetch/dist/natty-fetch.pc" },
{ "library": "nattyFetch", "name": "natty-fetch/dist/natty-fetch" },
{ "library": "nattyStorage", "name": "natty-storage" },
{ "library": "Rax", "name": "rax" },
{
"urls": ["https://g.alicdn.com/ib-fe/ib-vendor/mx/gl.js"],
"library": "mapboxgl",
"name": "@ali/ib-mapbox",
"version": "1.0.0"
}
],
"components": [{
"componentName": "Page",
"title": "页面",
"configure": {
"events": {
"supportedLifecycles": [{
"description": "初始化时",
"name": "constructor"
}, {
"description": "装载后",
"name": "componentDidMount"
}, {
"description": "更新时",
"name": "componentDidMount"
}, {
"description": "卸载时",
"name": "componentWillUnmount"
}]
"appKey": "template_deep_mobile",
"systemType": "",
"componentDependencies": [
{
"prototypeViewsUrl": null,
"prototypeUrls": {
"default": [
"https://g.alicdn.com/legao-comp/web_bundle_0724/@ali/vc-rax-page/4.0.4/proto.c94ee38.css",
"https://g.alicdn.com/legao-comp/web_bundle_0724/@ali/vc-rax-page/4.0.4/proto.bf61331.js"
]
},
"component": {
"isContainer": true
}
}
},{
"componentName": "View",
"npm": {
"package": "rax-view",
"destructuring": true,
"exportName": "View"
"prototypeConfigsUrl": [
"https://g.alicdn.com/legao-comp/web_bundle_0724/@ali/vc-rax-page/4.0.4/proto.c94ee38.css",
"https://g.alicdn.com/legao-comp/web_bundle_0724/@ali/vc-rax-page/4.0.4/proto.bf61331.js"
],
"alias": "",
"urls": [
"https://g.alicdn.com/legao-comp/web_bundle_0724/@ali/vc-rax-page/4.0.4/view.5030228.css",
"https://g.alicdn.com/legao-comp/web_bundle_0724/@ali/vc-rax-page/4.0.4/view.6186d2f.js"
],
"library": "AliVcRaxPage",
"components": null,
"packageName": "@ali/vc-rax-page",
"version": "4.0.4"
},
"title": "视图",
"configure": {
"component": {
"isContainer": true
}
}
},{
"componentName": "Text",
"npm": {
"package": "rax-text",
"destructuring": true,
"exportName": "Text"
{
"prototypeViewsUrl": null,
"prototypeUrls": {
"default": [
"https://g.alicdn.com/legao-comp/web_bundle_0724/@ali/vc-deep-mobile-open-button/1.0.5/proto.798dd4e.css",
"https://g.alicdn.com/legao-comp/web_bundle_0724/@ali/vc-deep-mobile-open-button/1.0.5/proto.78c100c.js"
]
},
"prototypeConfigsUrl": [
"https://g.alicdn.com/legao-comp/web_bundle_0724/@ali/vc-deep-mobile-open-button/1.0.5/proto.798dd4e.css",
"https://g.alicdn.com/legao-comp/web_bundle_0724/@ali/vc-deep-mobile-open-button/1.0.5/proto.78c100c.js"
],
"alias": "",
"urls": [
"https://g.alicdn.com/legao-comp/web_bundle_0724/@ali/vc-deep-mobile-open-button/1.0.5/view.23d106a.css",
"https://g.alicdn.com/legao-comp/web_bundle_0724/@ali/vc-deep-mobile-open-button/1.0.5/view.314cec4.js"
],
"library": "AliVcDeepMobileOpenButton",
"components": null,
"packageName": "@ali/vc-deep-mobile-open-button",
"version": "1.0.5"
},
"title": "文本",
"configure": {
"component": {
"isContainer": true
}
{
"prototypeViewsUrl": null,
"prototypeUrls": {
"default": [
"https://g.alicdn.com/legao-comp/web_bundle_0724/@ali/vc-deep-mobile/2.0.1-beta.5/proto.bb4ec38.css",
"https://g.alicdn.com/legao-comp/web_bundle_0724/@ali/vc-deep-mobile/2.0.1-beta.5/proto.ed31eab.js"
]
},
"prototypeConfigsUrl": [
"https://g.alicdn.com/legao-comp/web_bundle_0724/@ali/vc-deep-mobile/2.0.1-beta.5/proto.bb4ec38.css",
"https://g.alicdn.com/legao-comp/web_bundle_0724/@ali/vc-deep-mobile/2.0.1-beta.5/proto.ed31eab.js"
],
"alias": "",
"urls": [
"https://g.alicdn.com/legao-comp/web_bundle_0724/@ali/vc-deep-mobile/2.0.1-beta.5/view.f2b6dde.css",
"https://g.alicdn.com/legao-comp/web_bundle_0724/@ali/vc-deep-mobile/2.0.1-beta.5/view.46f546f.js",
"https://g.alicdn.com/legao-comp/web_bundle_0724/@ali/vc-deep-mobile/2.0.1-beta.5/view.mobile.f2b6dde.css",
"https://g.alicdn.com/legao-comp/web_bundle_0724/@ali/vc-deep-mobile/2.0.1-beta.5/view.mobile.6b901e9.js"
],
"library": "AliVcDeepMobile",
"components": null,
"packageName": "@ali/vc-deep-mobile",
"version": "2.0.1-beta.5"
},
{
"prototypeViewsUrl": null,
"prototypeUrls": {
"default": ["https://g.alicdn.com/legao-comp/web_bundle_0724/@ali/vc-component/1.1.1/proto.55a6360.js"]
},
"prototypeConfigsUrl": [
"https://g.alicdn.com/legao-comp/web_bundle_0724/@ali/vc-component/1.1.1/proto.55a6360.js"
],
"alias": "",
"urls": [
"https://g.alicdn.com/legao-comp/web_bundle_0724/@ali/vc-component/1.1.1/view.0e43387.css",
"https://g.alicdn.com/legao-comp/web_bundle_0724/@ali/vc-component/1.1.1/view.4ea485d.js"
],
"library": "AliVcComponent",
"components": null,
"packageName": "@ali/vc-component",
"version": "1.1.1"
},
{
"prototypeViewsUrl": null,
"prototypeUrls": {
"default": [
"https://g.alicdn.com/legao-comp/web_bundle_0724/@ali/vc-block-wrapper/1.0.6/proto.1cca36a.css",
"https://g.alicdn.com/legao-comp/web_bundle_0724/@ali/vc-block-wrapper/1.0.6/proto.a3ca779.js"
]
},
"prototypeConfigsUrl": [
"https://g.alicdn.com/legao-comp/web_bundle_0724/@ali/vc-block-wrapper/1.0.6/proto.1cca36a.css",
"https://g.alicdn.com/legao-comp/web_bundle_0724/@ali/vc-block-wrapper/1.0.6/proto.a3ca779.js"
],
"alias": "",
"urls": ["https://g.alicdn.com/legao-comp/web_bundle_0724/@ali/vc-block-wrapper/1.0.6/view.54ba1c5.js"],
"library": "AliVcBlockWrapper",
"components": null,
"packageName": "@ali/vc-block-wrapper",
"version": "1.0.6"
}
}]
],
"utilsDependencies": [
{
"prototypeViewsUrl": null,
"prototypeUrls": null,
"prototypeConfigsUrl": null,
"alias": "",
"urls": ["https://g.alicdn.com/legao-comp/web_bundle_0724/@ali/vu-toolkit/1.0.8/main.e3b517b.js"],
"library": "AliVuToolkit",
"components": null,
"packageName": "@ali/vu-toolkit",
"version": "1.0.8"
},
{
"prototypeViewsUrl": null,
"prototypeUrls": null,
"prototypeConfigsUrl": null,
"alias": "",
"urls": [
"https://g.alicdn.com/legao-comp/web_bundle_0724/@ali/vu-fusion-miniapp/2.0.0/main.a9303b0.css",
"https://g.alicdn.com/legao-comp/web_bundle_0724/@ali/vu-fusion-miniapp/2.0.0/main.0a9dcbf.js"
],
"library": "AliVuFusionMiniapp",
"components": null,
"packageName": "@ali/vu-fusion-miniapp",
"version": "2.0.0"
},
{
"prototypeViewsUrl": null,
"prototypeUrls": null,
"prototypeConfigsUrl": null,
"alias": "",
"urls": ["https://g.alicdn.com/legao-comp/web_bundle_0724/@ali/vu-legao-builtin/1.4.0-beta.5/main.ce04344.js"],
"library": "AliVuLegaoBuiltin",
"components": null,
"packageName": "@ali/vu-legao-builtin",
"version": "1.4.0-beta.5"
},
{
"prototypeViewsUrl": null,
"prototypeUrls": null,
"prototypeConfigsUrl": null,
"alias": "",
"urls": ["https://g.alicdn.com/legao-comp/web_bundle_0724/@ali/vu-dataSource/1.0.4/main.f11b596.js"],
"library": "AliVuDataSource",
"components": null,
"packageName": "@ali/vu-dataSource",
"version": "1.0.4"
},
{
"prototypeViewsUrl": null,
"prototypeUrls": null,
"prototypeConfigsUrl": null,
"alias": "",
"urls": ["https://g.alicdn.com/legao-comp/web_bundle_0724/@ali/vu-formatter/2.0.0/main.60e759a.js"],
"library": "AliVuFormatter",
"components": null,
"packageName": "@ali/vu-formatter",
"version": "2.0.0"
},
{
"prototypeViewsUrl": null,
"prototypeUrls": null,
"prototypeConfigsUrl": null,
"alias": "",
"urls": ["https://g.alicdn.com/legao-comp/web_bundle_0724/@ali/vu-router-miniapp/0.1.1/main.3d126aa.js"],
"library": "AliVuRouterMiniapp",
"components": null,
"packageName": "@ali/vu-router-miniapp",
"version": "0.1.1"
},
{
"prototypeViewsUrl": null,
"prototypeUrls": null,
"prototypeConfigsUrl": null,
"alias": "universal",
"urls": ["https://g.alicdn.com/legao-comp/web_bundle_0724/@ali/deep-mobile-universal-api/1.1.2/main.0cfe8ef.js"],
"library": "AliDeepMobileUniversalApi",
"components": null,
"packageName": "@ali/deep-mobile-universal-api",
"version": "1.1.2"
},
{
"prototypeViewsUrl": null,
"prototypeUrls": null,
"prototypeConfigsUrl": null,
"alias": "",
"urls": [
"https://g.alicdn.com/legao-comp/web_bundle_0724/@ali/vu-router/1.2.1/main.5a856a4.css",
"https://g.alicdn.com/legao-comp/web_bundle_0724/@ali/vu-router/1.2.1/main.e896278.js"
],
"library": "AliVuRouter",
"components": null,
"packageName": "@ali/vu-router",
"version": "1.2.1"
},
{
"prototypeViewsUrl": null,
"prototypeUrls": null,
"prototypeConfigsUrl": null,
"alias": "",
"urls": [
"https://g.alicdn.com/legao-comp/web_bundle_0724/@ali/vu-router-spa/1.3.13/main.bc8c738.css",
"https://g.alicdn.com/legao-comp/web_bundle_0724/@ali/vu-router-spa/1.3.13/main.1cff595.js"
],
"library": "AliVuRouterSpa",
"components": null,
"packageName": "@ali/vu-router-spa",
"version": "1.3.13"
},
{
"prototypeViewsUrl": null,
"prototypeUrls": null,
"prototypeConfigsUrl": null,
"alias": "",
"urls": ["https://g.alicdn.com/legao-comp/web_bundle_0724/@ali/vu-spm/1.1.11/main.2f6a6e1.js"],
"library": "AliVuSpm",
"components": null,
"packageName": "@ali/vu-spm",
"version": "1.1.11"
},
{
"prototypeViewsUrl": null,
"prototypeUrls": null,
"prototypeConfigsUrl": null,
"alias": "",
"urls": [
"https://g.alicdn.com/legao-comp/web_bundle_0724/@ali/vu-switch-schema/1.0.7/main.1d9ec8c.css",
"https://g.alicdn.com/legao-comp/web_bundle_0724/@ali/vu-switch-schema/1.0.7/main.0e44788.js"
],
"library": "AliVuSwitchSchema",
"components": null,
"packageName": "@ali/vu-switch-schema",
"version": "1.0.7"
}
],
"otherDependencies": [
{
"prototypeViewsUrl": null,
"prototypeUrls": null,
"prototypeConfigsUrl": null,
"alias": "",
"urls": [
"https://g.alicdn.com/legao-comp/web_bundle_0724/@ali/vp-rax-vision-page/2.0.3/main.a344c97.css",
"https://g.alicdn.com/legao-comp/web_bundle_0724/@ali/vp-rax-vision-page/2.0.3/main.1b46312.js"
],
"library": "AliVpRaxVisionPage",
"components": null,
"packageName": "@ali/vp-rax-vision-page",
"version": "2.0.3"
},
{
"prototypeViewsUrl": null,
"prototypeUrls": null,
"prototypeConfigsUrl": null,
"alias": "",
"urls": ["https://g.alicdn.com/legao-comp/web_bundle_0724/@ali/vm-router/1.0.8/main.fd43d18.js"],
"library": "AliVmRouter",
"components": null,
"packageName": "@ali/vm-router",
"version": "1.0.8"
},
{
"prototypeViewsUrl": null,
"prototypeUrls": null,
"prototypeConfigsUrl": null,
"alias": "",
"urls": ["https://g.alicdn.com/legao-comp/web_bundle_0724/@ali/vm-schema-nav/1.0.0/main.427ff0d.js"],
"library": "AliVmSchemaNav",
"components": null,
"packageName": "@ali/vm-schema-nav",
"version": "1.0.0"
}
],
"lowCodeDependencies": []
}

15
packages/demo/src/vision/index.ts
View File

@ -1,7 +1,7 @@
/* eslint-disable */
import { createElement } from 'react';
import { Button } from '@alifd/next';
import Engine, { Panes, Prototype } from '@ali/visualengine';
import Engine, { Panes, Prototype, Editor } from '@ali/visualengine';
import { ActionUtil as actionUtil } from '@ali/visualengine-utils';
import getTrunkPane from '@ali/ve-trunk-pane';
import DatapoolPane from '@ali/ve-datapool-pane';
@ -102,8 +102,8 @@ context.use(HOOKS.VE_SETTING_FIELD_VARIABLE_SETTER, VariableSetter);
const externals = ['react', 'react-dom', 'prop-types', 'react-router', 'react-router-dom', '@ali/recore'];
async function loadAssets() {
// const legaoAssets = await editor.utils.get('./raxAssets.json');
const legaoAssets = await editor.utils.get('./legao-assets.json');
const legaoAssets = await editor.utils.get('./raxAssets.json');
// const legaoAssets = await editor.utils.get('./legao-assets.json');
const assets = upgradeAssetsBundle(legaoAssets);
@ -145,9 +145,12 @@ async function loadAssets() {
}
async function loadSchema() {
// const schema = await editor.utils.get('./rax.json');
const schema = await editor.utils.get('./schema.json');
const schema = await editor.utils.get('./rax.json');
// const schema = await editor.utils.get('./schema.json');
editor.set('schema', schema);
editor.set('renderEnv', 'rax');
editor.set('clientTypes', ['mobile']);
}
// demo
@ -515,5 +518,7 @@ async function init() {
initDemoPanes();
// initHistoryPane();
Engine.init();
// Engine.Env.set('renderEnv', 'rax');
}
init();

5
packages/rax-provider/package.json
View File

@ -12,12 +12,15 @@
"scripts": {
"start": "build-scripts start"
},
"peerDependencies": {
"prop-types": "^15.7.2",
"rax": "^1.1.0"
},
"license": "MIT",
"dependencies": {
"@ali/lowcode-runtime": "^0.8.16",
"driver-universal": "^3.1.3",
"history": "^4.10.1",
"rax": "1.1.2",
"rax-use-router": "^3.0.0"
},
"devDependencies": {

7
packages/rax-render/src/engine/base.jsx
View File

@ -207,6 +207,7 @@ export default class BaseEngine extends Component {
// parentInfo 父组件的信息，包含schema和Comp
// idx 若为循环渲染的循环Index
__createVirtualDom = (schema, self, parentInfo, idx) => {
if (!schema) return null;
// rax text prop 兼容处理
if (schema.componentName === 'Text') {
@ -243,7 +244,7 @@ export default class BaseEngine extends Component {
return schema;
}
if (!isSchema(schema)) return null;
let Comp = components[schema.componentName] || View;
let Comp = components[schema.componentName] || engine.getNotFoundComponent();
if (schema.loop !== undefined) {
return this.__createLoopVirtualDom(
@ -367,9 +368,9 @@ export default class BaseEngine extends Component {
if (OVERLAY_LIST.includes(schema.componentName)) {
const { ref, ...overlayProps } = otherProps;
return (
<Div ref={ref} __designMode={engine.props.designMode}>
<div ref={ref} __designMode={engine.props.designMode}>
{renderComp({ ...props, ...overlayProps })}
</Div>
</div>
);
}
// 虚拟dom显示

5
packages/rax-render/src/engine/index.jsx
View File

@ -11,6 +11,7 @@ import ComponentEngine from './compEngine';
import BlockEngine from './blockEngine';
import TempEngine from './tempEngine';
import BaseEngine from './base';
import compWrapper from '../hoc/compWrapper';
const debug = Debug('engine:entry');
const ENGINE_COMPS = {
@ -24,14 +25,14 @@ class FaultComponent extends Component {
render() {
// FIXME: errorlog
console.error('render error', this.props);
return <Div>RenderError</Div>;
return <div>RenderError</div>;
}
}
class NotFoundComponent extends Component {
render() {
console.error('component not found', this.props);
return <Div {...this.props} />;
return <div {...this.props} />;
}
}

4
packages/rax-render/src/hoc/compFactory.js
View File

@ -1,4 +1,4 @@
import { Component, createElement } from 'rax';
import { Component, createElement, forwardRef } from 'rax';
import PropTypes from 'prop-types';
import AppHelper from '../utils/appHelper';
import { forEach, isFileSchema } from '../utils';
@ -62,7 +62,7 @@ export default function compFactory(schema, components = {}, componentsMap = {},
}
}
const ResComp = React.forwardRef((props, ref) => <LNCompView {...props} forwardedRef={ref} />);
const ResComp = forwardRef((props, ref) => <LNCompView {...props} forwardedRef={ref} />);
forEach(schema.static, (val, key) => {
ResComp[key] = val;
});

35
packages/rax-render/src/hoc/compWrapper.js
View File

@ -1,17 +1,28 @@
import { createElement, Component } from 'rax';
export default function (Comp) {
class CompWrapper extends Component {
constructor(props, context) {
super(props, context);
}
import { Component, createElement, forwardRef } from 'rax';
function enhanced(Comp) {
class WrappedComponent extends Component {
render() {
return createElement(Comp, {
...this.props,
});
const { forwardedRef, ...rest} = this.props;
console.log('forwardedRef', forwardedRef)
return <Comp { ...rest } ref={forwardedRef}></Comp>
}
}
return CompWrapper;
}
function forwardedRef(props, ref) {
return createElement(
WrappedComponent,
{
...props,
forwardedRef: ref
}
)
}
forwardedRef.displayName = Comp.displayName;
return forwardRef(forwardedRef);
};
export default enhanced;

2
packages/rax-render/src/utils/index.js
View File

@ -268,7 +268,7 @@ export function generateI18n(locale = 'zh-CN', messages = {}) {
* @param {*} Comp 需要判断的组件
*/
export function acceptsRef(Comp) {
return !!Comp;
return true;
}
/**

1
packages/rax-simulator-renderer/package.json
View File

@ -23,6 +23,7 @@
"@recore/obx-react": "^1.0.7",
"classnames": "^2.2.6",
"driver-universal": "^3.1.3",
"rax-find-dom-node": "^1.0.0",
"lodash": "^4.17.19",
"react": "^16",
"react-dom": "^16.7.0"

9
packages/rax-simulator-renderer/src/renderer-view.tsx
View File

@ -1,6 +1,6 @@
import { Fragment, Component, createElement } from 'rax';
// import { observer } from './obx-rax/observer';
import RaxEngine from '../../rax-render/src/index';
import LowCodeRenderer from '../../rax-render/src/index';
import { SimulatorRenderer } from './renderer';
import { host } from './host';
@ -99,17 +99,16 @@ class Renderer extends Component<{ renderer: SimulatorRenderer }> {
render() {
const { renderer } = this.props;
const { device, designMode } = renderer;
console.info(renderer.schema);
return (
<RaxEngine
<LowCodeRenderer
schema={renderer.schema}
components={renderer.components}
context={renderer.context}
designMode={renderer.designMode}
suspended={renderer.suspended}
self={renderer.scope}
onCompGetRef={(schema: any, ref: ReactInstance | null) => {
onCompGetRef={(schema: any, ref: any) => {
renderer.mountInstance(schema.id, ref);
}}
customCreateElement={(Component: any, props: any, children: any) => {
@ -123,7 +122,7 @@ class Renderer extends Component<{ renderer: SimulatorRenderer }> {
// Object.assign(viewProps, {
// _componentName: 'Menu',
// className: '_css_pesudo_menu_kbrzyh0f',
// context: { VE: (window as any).VisualEngine },
// context: { VE: (window as any).VisualLowCodeRenderer },
// direction: undefined,
// events: { ignored: true },
// fieldId: 'menu_kbrzyh0f',

8
packages/rax-simulator-renderer/src/renderer.ts
View File

@ -1,12 +1,12 @@
import { BuiltinSimulatorRenderer, NodeInstance, Component } from '@ali/lowcode-designer';
import { shared, render, createElement } from 'rax';
import { shared, render as raxRender, createElement } from 'rax';
import DriverUniversal from 'driver-universal';
import { computed, obx } from '@recore/obx';
import { RootSchema, NpmInfo, ComponentSchema } from '@ali/lowcode-types';
import { Asset, isReactComponent, isESModule, setNativeSelection, cursor, isElement } from '@ali/lowcode-utils';
import SimulatorRendererView from './renderer-view';
import RaxEngine from '../../rax-render/src/index';
import { raxFindDOMNodes } from './utils/find-dom-nodes';
import { getClientRects } from './utils/get-client-rects';
import loader from './utils/loader';
@ -192,7 +192,7 @@ export class SimulatorRenderer implements BuiltinSimulatorRenderer {
}
findDOMNodes(instance: any): Array<Element | Text> | null {
return [RaxEngine.findDOMNode(instance)];
return [raxFindDOMNodes(instance)];
}
/**
@ -294,7 +294,7 @@ export class SimulatorRenderer implements BuiltinSimulatorRenderer {
document.documentElement.classList.add('engine-page');
document.body.classList.add('engine-document'); // important! Stylesheet.invoke depends
render(createElement(SimulatorRendererView, { renderer: this }), document.getElementById('app'), {
raxRender(createElement(SimulatorRendererView, { renderer: this }), container, {
driver: DriverUniversal,
});
host.document.setRendererReady(this);

2
packages/react-renderer/package.json
View File

@ -39,8 +39,6 @@
"localforage": "^1.7.3",
"lodash": "^4.17.11",
"moment": "^2.24.0",
"rax": "^1.1.1",
"rax-find-dom-node": "^1.0.1",
"react-is": "^16.10.1",
"serialize-javascript": "^1.7.0",
"socket.io-client": "^2.2.0",

1
packages/utils/src/is-element.ts
View File

@ -1,3 +1,4 @@
export function isElement(node: any): node is Element {
if (!node) return false;
return node.nodeType === Node.ELEMENT_NODE;
}