+
);
}
diff --git a/packages/plugin-sample-preview/src/index.tsx b/packages/plugin-sample-preview/src/index.tsx
index af0ea82bc..9363228aa 100644
--- a/packages/plugin-sample-preview/src/index.tsx
+++ b/packages/plugin-sample-preview/src/index.tsx
@@ -13,6 +13,9 @@ const SamplePreview = ({ editor }: PluginProps) => {
if (!editor) {
return;
}
+ // 由于monaco editor的cdn加载形式会占用define字段，导致预览的时候部分next组件加载异常，所以预览弹框的时候需要对define做一个临时的替换
+ window.__define = window.define;
+ window.define = null;
const designer = editor.get(Designer);
if (designer) {
const assets = await editor.get('assets');
@@ -46,11 +49,16 @@ const SamplePreview = ({ editor }: PluginProps) => {
components,
});
setVisible(true);
+
+
}
}
function handleClose() {
+ window.define = window.__define;
setVisible(false);
+
+
}
const { schema, components } = data;
diff --git a/packages/plugin-source-editor/src/transform.ts b/packages/plugin-source-editor/src/transform.ts
index cdc9e39b9..934b984e2 100644
--- a/packages/plugin-source-editor/src/transform.ts
+++ b/packages/plugin-source-editor/src/transform.ts
@@ -7,7 +7,7 @@ const transfrom = {
schema2Code(schema) {
const componentSchema = schema.componentsTree[0];
const code =
- `export default class {
+ `export default class LowcodeComponent extends Component {
${initStateCode(componentSchema)}
${initLifeCycleCode(componentSchema)}
${initMethodsCode(componentSchema)}
@@ -17,40 +17,118 @@ const transfrom = {
},
code2Schema(code: string) {
- const newCode = code.replace(/export default class/, 'class A');
- let A; let a;
- try {
- // eslint-disable-next-line no-eval
- A = eval(`(${newCode})`);
- a = new A();
- } catch (e) {
- console.log(e.message);
- return null;
- }
-
- // eslint-disable-next-line no-proto
- const functionNameList = Object.getOwnPropertyNames(a.__proto__);
-
+ let codeNew = code;
const functionMap = {};
+ let startIndex;
- functionNameList.map((functionName) => {
- if (functionName != 'constructor') {
- if (a[functionName]) {
- const functionCode = a[functionName].toString().replace(new RegExp(functionName), 'function');
- functionMap[functionName] = functionCode;
- }
- }
- return functionName;
- });
-
- if (a.state) {
- functionMap.state = a.state;
+ const stateStartStr = this.pickupStateStartStr(codeNew);
+ if (stateStartStr != null) {
+ startIndex = codeNew.indexOf(stateStartStr) + stateStartStr.length;
+ const stateBodyStr = this.pickupFunctionBody(codeNew, startIndex);
+ const stateData = JSON.parse('{' + stateBodyStr);
+ functionMap.state = stateData;
}
+
+ while (true) {
+ const functionNameStr = this.pickupFunctionName(codeNew);
+ if (functionNameStr != null) {
+ startIndex = codeNew.indexOf(functionNameStr) + functionNameStr.length;
+ const functionBodyStr = this.pickupFunctionBody(codeNew, startIndex);
+ const functionStr = functionNameStr + functionBodyStr;
+ codeNew = codeNew.replace(functionStr, '');
+ const functionName = functionNameStr.match(/\w+/);
+ functionMap[functionName] = functionStr.replace(functionName, 'function');
+ } else {
+ break;
+ }
+ }
+
+
+ // debugger;
+ // const newCode = code.replace(/export default class LowcodeComponent extends Component/, 'class A');
+ // let A; let a;
+ // try {
+ // // eslint-disable-next-line no-eval
+ // A = eval(`(${newCode})`);
+ // a = new A();
+ // } catch (e) {
+ // console.log(e.message);
+ // return null;
+ // }
+
+ // // eslint-disable-next-line no-proto
+ // const functionNameList = Object.getOwnPropertyNames(a.__proto__);
+
+ // const functionMap = {};
+ // functionNameList.map((functionName) => {
+ // if (functionName != 'constructor') {
+ // if (a[functionName]) {
+ // const functionCode = a[functionName].toString().replace(new RegExp(functionName), 'function');
+ // functionMap[functionName] = functionCode;
+ // }
+ // }
+ // return functionName;
+ // });
+
+ // if (a.state) {
+ // functionMap.state = a.state;
+ // }
+
console.log(functionMap);
return functionMap;
},
+
+ pickupFunctionName(codeStr) {
+ // 函数名的正则表达式
+ // eslint-disable-next-line no-useless-escape
+ const reg = /\w+\s?\((\w|\,|\s)*\)\s?\{/;
+ const result = codeStr.match(reg);
+ if (result && result[0]) {
+ const functionNameStr = result[0];
+ return functionNameStr;
+ }
+ return null;
+ },
+
+ pickupFunctionBody(codeStr, startIndex) {
+ const startStr = codeStr.substr(startIndex);
+ const stack = []; let endIndex;
+ for (let i = 0; i < startStr.length; i++) {
+ // 如果发现已经有{,则是内函数或者是系统函数，需要进行排除
+ if (startStr[i] === '{') {
+ stack.push(i);
+ }
+
+ // 判断是否是函数体的结尾
+ if (startStr[i] === '}') {
+ // 有内函数，出栈
+ if (stack.length > 0) {
+ stack.pop();
+ } else {
+ endIndex = i;
+ break;
+ }
+ }
+ }
+
+ const functionBodyStr = startStr.substr(0, endIndex + 1);
+ // console.log(functionBodyStr);
+ return functionBodyStr;
+ },
+
+ // 捕获state头部部分
+ pickupStateStartStr(codeStr) {
+ const reg = /state\s?=\s?\s?\{/;
+ const result = codeStr.match(reg);
+ if (result && result[0]) {
+ const stateStartStr = result[0];
+ return stateStartStr;
+ }
+ return null;
+ },
+
getNewFunctionCode(functionName: string) {
return `\n\t${functionName}(){\n\t}\n`;
},
diff --git a/packages/react-renderer/package.json b/packages/react-renderer/package.json
index 1c1ef9e07..b66e28a27 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.9/build/index.html"
+ "homepage": "https://unpkg.alibaba-inc.com/@ali/lowcode-react-renderer@1.0.10/build/index.html"
}