From b1a61006bba4292790899c7c49c9c611a9384472 Mon Sep 17 00:00:00 2001 From: Clarence-pan Date: Sun, 10 Apr 2022 19:12:44 +0800 Subject: [PATCH] =?UTF-8?q?fix:=20=E4=BF=AE=E6=AD=A3=20react=20=E6=A1=86?= =?UTF-8?q?=E6=9E=B6=E5=87=BA=E7=A0=81=E4=B8=AD=E5=9C=A8=E4=B8=A5=E6=A0=BC?= =?UTF-8?q?=E6=A8=A1=E5=BC=8F=E5=AF=B9=20methods=20=E5=92=8C=20context=20?= =?UTF-8?q?=E7=9A=84=E5=A4=84=E7=90=86?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../component/react/containerInjectContext.ts | 53 ++++++++++++++----- .../component/react/containerMethod.ts | 38 +++++++++---- modules/code-generator/src/solutions/icejs.ts | 9 +++- 3 files changed, 78 insertions(+), 22 deletions(-) diff --git a/modules/code-generator/src/plugins/component/react/containerInjectContext.ts b/modules/code-generator/src/plugins/component/react/containerInjectContext.ts index eb687ef0e..434a5cf1c 100644 --- a/modules/code-generator/src/plugins/component/react/containerInjectContext.ts +++ b/modules/code-generator/src/plugins/component/react/containerInjectContext.ts @@ -10,6 +10,7 @@ import { ICodeStruct, IContainerInfo, } from '../../../types'; +import { DEFAULT_LINK_AFTER } from '../../../const'; export interface PluginConfig { fileType: string; @@ -30,18 +31,7 @@ const pluginFactory: BuilderComponentPluginFactory = (config?) => const scope = Scope.createRootScope(); const { inStrictMode } = next.contextData; - if (inStrictMode) { - next.chunks.push({ - type: ChunkType.STRING, - fileType: cfg.fileType, - name: CLASS_DEFINE_CHUNK_NAME.InsVar, - content: ` - _context = this._createContext(); - `, - linkAfter: [CLASS_DEFINE_CHUNK_NAME.Start], - }); - // TODO: createContext...... - } else { + if (!inStrictMode) { // 非严格模式下，上下文就是自己 next.chunks.push({ type: ChunkType.STRING, @@ -52,6 +42,45 @@ const pluginFactory: BuilderComponentPluginFactory = (config?) => `, linkAfter: [CLASS_DEFINE_CHUNK_NAME.Start], }); + } else { + // 严格模式下的上下文只保留协议中规定的那些 + next.chunks.push({ + type: ChunkType.STRING, + fileType: cfg.fileType, + name: CLASS_DEFINE_CHUNK_NAME.InsVar, + content: ` + _context = this._createContext(); + `, + linkAfter: [CLASS_DEFINE_CHUNK_NAME.Start], + }); + + next.chunks.push({ + type: ChunkType.STRING, + fileType: cfg.fileType, + name: CLASS_DEFINE_CHUNK_NAME.InsPrivateMethod, + content: ` + _createContext() { + const self = this; + const context = { + get state() { return self.state; }, + setState(newState, callback) { self.setState(newState, callback); }, + get dataSourceMap() { return self._dataSourceEngine.dataSourceMap || {}; }, + async reloadDataSource() { await self._dataSourceEngine.reloadDataSource(); }, + get utils() { return self.utils; }, + get page() { return context; }, + get component() { return context; }, + get props() { return self.props; }, + get constants() { return self.constants; }, + get $() { return self.$ }, + get $$() { return self.$$ }, + ...this._methods, + }; + + return context; + } + `, + linkAfter: DEFAULT_LINK_AFTER[CLASS_DEFINE_CHUNK_NAME.InsPrivateMethod], + }); } return next; diff --git a/modules/code-generator/src/plugins/component/react/containerMethod.ts b/modules/code-generator/src/plugins/component/react/containerMethod.ts index b44b9a74b..fc4a38705 100644 --- a/modules/code-generator/src/plugins/component/react/containerMethod.ts +++ b/modules/code-generator/src/plugins/component/react/containerMethod.ts @@ -11,6 +11,7 @@ import { ICodeStruct, IContainerInfo, } from '../../../types'; +import { isValidIdentifier } from '../../../utils/validate'; export interface PluginConfig { fileType: string; @@ -28,18 +29,37 @@ const pluginFactory: BuilderComponentPluginFactory = (config?) => }; const ir = next.ir as IContainerInfo; + const { inStrictMode } = next.contextData; - if (ir.methods) { - const { methods } = ir; - const chunks = Object.keys(methods).map((methodName) => ({ + if (!ir.methods) { + return next; + } + + // 将这些 methods 都定义到 class 上 + const { methods } = ir; + const chunks = Object.keys(methods).map((methodName) => ({ + type: ChunkType.STRING, + fileType: cfg.fileType, + name: CLASS_DEFINE_CHUNK_NAME.InsMethod, + content: generateFunction(methods[methodName], { name: methodName, isMember: true }), + linkAfter: [...DEFAULT_LINK_AFTER[CLASS_DEFINE_CHUNK_NAME.InsMethod]], + })); + next.chunks.push(...chunks); + + // 严格模式下需要将这些方法都挂到上下文中 + if (inStrictMode) { + next.chunks.push({ type: ChunkType.STRING, fileType: cfg.fileType, - name: CLASS_DEFINE_CHUNK_NAME.InsMethod, - content: generateFunction(methods[methodName], { name: methodName, isMember: true }), - linkAfter: [...DEFAULT_LINK_AFTER[CLASS_DEFINE_CHUNK_NAME.InsMethod]], - })); - - next.chunks.push(...chunks); + name: CLASS_DEFINE_CHUNK_NAME.ConstructorContent, + content: Object.keys(ir.methods) + .map((methodName) => + isValidIdentifier(methodName) ? `.${methodName}` : `[${JSON.stringify(methodName)}]`, + ) + .map((method) => `this._context${method} = this${method};`) + .join('\n'), + linkAfter: [...DEFAULT_LINK_AFTER[CLASS_DEFINE_CHUNK_NAME.ConstructorContent]], + }); } return next; diff --git a/modules/code-generator/src/solutions/icejs.ts b/modules/code-generator/src/solutions/icejs.ts index 1b90f0b54..4d96ae64b 100644 --- a/modules/code-generator/src/solutions/icejs.ts +++ b/modules/code-generator/src/solutions/icejs.ts @@ -22,8 +22,15 @@ import icejs from '../plugins/project/framework/icejs'; import { prettier } from '../postprocessor'; -export default function createIceJsProjectBuilder(): IProjectBuilder { +export type IceJsProjectBuilderOptions = { + inStrictMode?: boolean; +}; + +export default function createIceJsProjectBuilder( + options?: IceJsProjectBuilderOptions, +): IProjectBuilder { return createProjectBuilder({ + inStrictMode: options?.inStrictMode, template: icejs.template, plugins: { components: [