JLNTV_IPD/tmagic-editor
4
0
Fork 0
mirror of https://github.com/Tencent/tmagic-editor.git synced 2025-06-22 01:39:31 +08:00
Code Issues Projects Releases Wiki Activity

refactor(stage): stageRender去除对stageCore对象的依赖，简化对象依赖关系

Browse Source
This commit is contained in:
oceanzhu 2022-10-22 16:41:25 +08:00 committed by roymondchen
parent baedcaba05
commit 638e996516
2 changed files with 19 additions and 15 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
packages/stage/src/StageCore.ts
View File

@ -75,7 +75,7 @@ export default class StageCore extends EventEmitter {
this.containerHighlightDuration = config.containerHighlightDuration || 800;
this.containerHighlightType = config.containerHighlightType;
this.renderer = new StageRender({ core: this });
this.renderer = new StageRender(config.runtimeUrl, this.render);
this.mask = new StageMask({ core: this });
this.dr = new StageDragResize({ core: this, container: this.mask.content, mask: this.mask });
this.multiDr = new StageMultiDragResize({ core: this, container: this.mask.content, mask: this.mask });
@ -374,6 +374,16 @@ export default class StageCore extends EventEmitter {
this.container = undefined;
}
/**
* 传入stageRender供其回调，获取业务方自定义渲染画布页面渲染结果
*/
private async render(): Promise<HTMLElement | null> {
if (this.config?.render) {
return await this.config.render(this);
}
return null;
}
private async getTargetElement(idOrEl: Id | HTMLElement): Promise<HTMLElement> {
if (typeof idOrEl === 'string' || typeof idOrEl === 'number') {
const el = this.renderer.contentWindow?.document.getElementById(`${idOrEl}`);

22
packages/stage/src/StageRender.ts
View File

@ -20,9 +20,8 @@ import { EventEmitter } from 'events';
import { getHost, injectStyle, isSameDomain } from '@tmagic/utils';
import StageCore from './StageCore';
import style from './style.css?raw';
import type { Runtime, RuntimeWindow, StageRenderConfig } from './types';
import type { Runtime, RuntimeWindow } from './types';
export default class StageRender extends EventEmitter {
/** 组件的js、css执行的环境，直接渲染为当前window，iframe渲染则为iframe.contentWindow */
@ -34,16 +33,13 @@ export default class StageRender extends EventEmitter {
public runtimeUrl?: string;
public core: StageCore;
private render: () => Promise<HTMLElement | null>;
private render?: (renderer: StageCore) => Promise<HTMLElement> | HTMLElement;
constructor({ core }: StageRenderConfig) {
constructor(runtimeUrl: string | undefined, render: () => Promise<HTMLElement | null>) {
super();
this.core = core;
this.runtimeUrl = core.config.runtimeUrl || '';
this.render = core.config.render;
this.runtimeUrl = runtimeUrl || '';
this.render = render;
this.iframe = globalThis.document.createElement('iframe');
// 同源，直接加载
@ -119,11 +115,9 @@ export default class StageRender extends EventEmitter {
if (!this.contentWindow) return;
if (this.render) {
const el = await this.render(this.core);
if (el) {
this.contentWindow.document?.body?.appendChild(el);
}
const el = await this.render();
if (el) {
this.contentWindow.document?.body?.appendChild(el);
}
this.emit('onload');