From b78d2fda1fe474b7004db038a51773c326b24f4e Mon Sep 17 00:00:00 2001 From: roymondchen Date: Wed, 21 May 2025 16:58:06 +0800 Subject: [PATCH] =?UTF-8?q?feat(core):=20=E6=96=B0=E5=A2=9E=E4=BA=8B?= =?UTF-8?q?=E4=BB=B6=E5=A4=84=E7=90=86=E5=89=8D=E5=90=8E=E7=9A=84=E9=92=A9?= =?UTF-8?q?=E5=AD=90=E5=87=BD=E6=95=B0=E9=85=8D=E7=BD=AE?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- packages/core/src/App.ts | 43 ++++++------------------------ packages/core/src/EventHelper.ts | 27 ++++++++++++++++++- packages/core/src/index.ts | 2 +- packages/core/src/type.ts | 45 ++++++++++++++++++++++++++++++++ 4 files changed, 80 insertions(+), 37 deletions(-) create mode 100644 packages/core/src/type.ts diff --git a/packages/core/src/App.ts b/packages/core/src/App.ts index 56afc707..08cc6eb5 100644 --- a/packages/core/src/App.ts +++ b/packages/core/src/App.ts @@ -20,14 +20,8 @@ import { EventEmitter } from 'events'; import { isEmpty } from 'lodash-es'; -import { - createDataSourceManager, - type DataSource, - DataSourceManager, - type DataSourceManagerData, - ObservedDataClass, -} from '@tmagic/data-source'; -import type { CodeBlockDSL, DataSourceSchema, Id, JsEngine, MApp, RequestFunction } from '@tmagic/schema'; +import { createDataSourceManager, DataSourceManager, type DataSourceManagerData } from '@tmagic/data-source'; +import type { CodeBlockDSL, Id, JsEngine, MApp, RequestFunction } from '@tmagic/schema'; import Env from './Env'; import EventHelper from './EventHelper'; @@ -35,34 +29,9 @@ import Flexible from './Flexible'; import FlowState from './FlowState'; import Node from './Node'; import Page from './Page'; +import { AppOptionsConfig, ErrorHandler } from './type'; import { transformStyle as defaultTransformStyle } from './utils'; -export type ErrorHandler = ( - err: Error, - node: DataSource | Node | undefined, - info: Record, -) => void; - -export interface AppOptionsConfig { - ua?: string; - env?: Env; - config?: MApp; - platform?: 'editor' | 'mobile' | 'tv' | 'pc'; - jsEngine?: JsEngine; - designWidth?: number; - curPage?: Id; - useMock?: boolean; - disabledFlexible?: boolean; - pageFragmentContainerType?: string | string[]; - iteratorContainerType?: string | string[]; - transformStyle?: (style: Record) => Record; - request?: RequestFunction; - DataSourceObservedData?: ObservedDataClass; - dataSourceManagerInitialData?: DataSourceManagerData; - nodeStoreInitialData?: () => any; - errorHandler?: ErrorHandler; -} - class App extends EventEmitter { [x: string]: any; static nodeClassMap = new Map(); @@ -134,7 +103,11 @@ class App extends EventEmitter { } if (this.platform !== 'editor') { - this.eventHelper = new EventHelper({ app: this }); + this.eventHelper = new EventHelper({ + app: this, + beforeEventHandler: options.beforeEventHandler, + afterEventHandler: options.afterEventHandler, + }); } this.transformStyle = diff --git a/packages/core/src/EventHelper.ts b/packages/core/src/EventHelper.ts index 496a1a09..39ce31b1 100644 --- a/packages/core/src/EventHelper.ts +++ b/packages/core/src/EventHelper.ts @@ -37,16 +37,29 @@ import { DATA_SOURCE_FIELDS_CHANGE_EVENT_PREFIX } from '@tmagic/utils'; import type { default as TMagicApp } from './App'; import FlowState from './FlowState'; import type { default as TMagicNode } from './Node'; +import { AfterEventHandler, BeforeEventHandler } from './type'; export default class EventHelper extends EventEmitter { public app: TMagicApp; private nodeEventList = new Map<(fromCpt: TMagicNode, ...args: any[]) => void, symbol>(); private dataSourceEventList = new Map void>>(); + private beforeEventHandler?: BeforeEventHandler; + private afterEventHandler?: AfterEventHandler; - constructor({ app }: { app: TMagicApp }) { + constructor({ + app, + beforeEventHandler, + afterEventHandler, + }: { + app: TMagicApp; + beforeEventHandler?: BeforeEventHandler; + afterEventHandler?: AfterEventHandler; + }) { super(); + this.beforeEventHandler = beforeEventHandler; + this.afterEventHandler = afterEventHandler; this.app = app; } @@ -59,6 +72,10 @@ export default class EventHelper extends EventEmitter { public bindNodeEvents(node: TMagicNode) { node.events?.forEach((event, index) => { + if (!event.name) { + return; + } + let eventNameKey = `${event.name}_${node.data.id}`; // 页面片容器可以配置页面片内组件的事件，形式为“${nodeId}.${eventName}” @@ -150,6 +167,10 @@ export default class EventHelper extends EventEmitter { private async eventHandler(config: EventConfig | number, fromCpt: TMagicNode | DataSource | undefined, args: any[]) { const eventConfig = typeof config === 'number' ? (fromCpt as TMagicNode).events[config] : config; + if (typeof this.beforeEventHandler === 'function') { + this.beforeEventHandler({ eventConfig, source: fromCpt, args }); + } + if (has(eventConfig, 'actions')) { // EventConfig类型 const flowState = new FlowState(); @@ -177,6 +198,10 @@ export default class EventHelper extends EventEmitter { } } } + + if (typeof this.afterEventHandler === 'function') { + this.afterEventHandler({ eventConfig, source: fromCpt, args }); + } } private async actionHandler( diff --git a/packages/core/src/index.ts b/packages/core/src/index.ts index 383259f8..14909d02 100644 --- a/packages/core/src/index.ts +++ b/packages/core/src/index.ts @@ -28,7 +28,7 @@ export * from '@tmagic/utils'; export { default as EventHelper } from './EventHelper'; export * from './utils'; -export { type AppOptionsConfig } from './App'; +export * from './type'; export { default as Env } from './Env'; export { default as Page } from './Page'; export { default as Node } from './Node'; diff --git a/packages/core/src/type.ts b/packages/core/src/type.ts new file mode 100644 index 00000000..4ac8aa8f --- /dev/null +++ b/packages/core/src/type.ts @@ -0,0 +1,45 @@ +import type { DataSource, DataSourceManagerData, ObservedDataClass } from '@tmagic/data-source'; +import type { DataSourceSchema, EventConfig, Id, JsEngine, MApp, RequestFunction } from '@tmagic/schema'; + +import type Env from './Env'; +import type TMagicNode from './Node'; + +export type ErrorHandler = ( + err: Error, + node: DataSource | TMagicNode | undefined, + info: Record, +) => void; + +export interface AppOptionsConfig { + ua?: string; + env?: Env; + config?: MApp; + platform?: 'editor' | 'mobile' | 'tv' | 'pc'; + jsEngine?: JsEngine; + designWidth?: number; + curPage?: Id; + useMock?: boolean; + disabledFlexible?: boolean; + pageFragmentContainerType?: string | string[]; + iteratorContainerType?: string | string[]; + transformStyle?: (style: Record) => Record; + request?: RequestFunction; + DataSourceObservedData?: ObservedDataClass; + dataSourceManagerInitialData?: DataSourceManagerData; + nodeStoreInitialData?: () => any; + errorHandler?: ErrorHandler; + beforeEventHandler?: BeforeEventHandler; + afterEventHandler?: AfterEventHandler; +} + +export type BeforeEventHandler = (args: { + eventConfig: EventConfig; + source: TMagicNode | DataSource | undefined; + args: any[]; +}) => void; + +export type AfterEventHandler = (args: { + eventConfig: EventConfig; + source: TMagicNode | DataSource | undefined; + args: any[]; +}) => void;