import{ax as s,z as t,A as e,b5 as a}from"./chunks/framework.V2ssSR2R.js";const k=JSON.parse('{"title":"App","description":"","frontmatter":{},"headers":[],"relativePath":"runtime-api/core/app.md","filePath":"runtime-api/core/app.md"}'),d={name:"runtime-api/core/app.md"};function n(l,i,o,p,r,h){return e(),t("div",null,[...i[0]||(i[0]=[a(`

App

App@tmagic/core 的核心类,继承自 EventEmitter,用于管理整个应用的状态和配置。

构造函数

typescript
new App(options: AppOptionsConfig)

AppOptionsConfig

参数类型说明
uastringUser Agent 字符串
envEnv环境信息实例
configMAppDSL 配置
platform'editor' | 'mobile' | 'tv' | 'pc'平台类型
jsEngineJsEngineJS 引擎类型
designWidthnumber设计稿宽度
curPageId当前页面 ID
useMockboolean是否使用 Mock 数据
disabledFlexibleboolean是否禁用 flexible
pageFragmentContainerTypestring | string[]页面片段容器类型
iteratorContainerTypestring | string[]迭代器容器类型
transformStyle(style: Record<string, any>) => Record<string, any>样式转换函数
requestRequestFunction请求函数
dataSourceManagerInitialDataDataSourceManagerData数据源管理器初始数据
nodeStoreInitialData() => any节点存储初始数据工厂函数
errorHandlerErrorHandler错误处理器
beforeEventHandlerBeforeEventHandler事件处理前钩子
afterEventHandlerAfterEventHandler事件处理后钩子

属性

属性类型说明
envEnv环境信息实例
dslMApp | undefinedDSL 配置
codeDslCodeBlockDSL | undefined代码块配置
dataSourceManagerDataSourceManager | undefined数据源管理器
pagePage | undefined当前页面
pageFragmentsMap<Id, Page>页面片段集合
platformstring平台类型
jsEngineJsEngineJS 引擎类型
componentsMap<string, any>已注册的组件
eventHelperEventHelper | undefined事件助手实例(仅当 platform !== 'editor' 时创建)
useMockboolean是否使用 Mock 数据,默认 false
requestRequestFunction | undefined请求函数
transformStyle(style: Record<string, any>) => Record<string, any>样式转换函数
pageFragmentContainerTypeSet<string>页面片段容器类型集合,默认包含 page-fragment-container
iteratorContainerTypeSet<string>迭代器容器类型集合,默认包含 iterator-container
errorHandlerErrorHandler | undefined错误处理器
nodeStoreInitialData(() => any) | undefined节点存储初始数据工厂函数

静态属性

nodeClassMap

静态方法

registerNode

typescript
import App from '@tmagic/core';

class CustomNode extends Node {
  // 自定义实现
}

App.registerNode('custom', CustomNode);

实例方法

setEnv

typescript
import App, { Env } from '@tmagic/core';

const app = new App({});
app.setEnv(navigator.userAgent);

// 也可以直接传入已创建的 Env 实例
app.setEnv(new Env(navigator.userAgent));

setDesignWidth

typescript
app.setDesignWidth(375);

setConfig

typescript
app.setConfig({
  id: 'app_1',
  type: 'app',
  items: [
    {
      id: 'page_1',
      type: 'page',
      items: []
    }
  ]
});

setPage

typescript
app.setPage('page_2');

deletePage

getPage

typescript
const page = app.getPage('page_1');

getNode

参数类型说明
iteratorContainerIdId[]迭代器容器 ID 数组
iteratorIndexnumber[]迭代器索引数组
pageFragmentContainerIdId页面片段容器 ID
strictboolean是否严格模式
typescript
const node = app.getNode('button_1');

registerComponent

typescript
app.registerComponent('my-button', MyButton);

unregisterComponent

resolveComponent

emit

runCode

typescript
await app.runCode('code_1', { key: 'value' });

runDataSourceMethod

typescript
const result = await app.runDataSourceMethod('ds_1', 'fetchData', { id: 123 });

destroy

typescript
app.destroy();

事件

App 继承自 EventEmitter,会通过 super.emit 触发以下事件:

事件名触发时机回调参数
dsl-change调用 setConfig 时触发({ dsl: MApp, curPage: Id })
page-change调用 setPage 切换页面时触发;切换到不存在的页面时也会触发,此时回调无参数。注意:当 pageConfig === this.page.data(重复 setPage 到当前页)时会直接 return触发该事件(page?: Page)

监听示例

typescript
app.on('dsl-change', ({ dsl, curPage }) => {
  console.log('DSL 已更新', dsl, curPage);
});

app.on('page-change', (page) => {
  console.log('当前页面切换为', page?.data?.id);
});
`,61)])])}const g=s(d,[["render",n]]);export{k as __pageData,g as default};