Skip to content

Node

Node@tmagic/core 的节点基类,继承自 EventEmitter,表示 DSL 中的一个节点。

构造函数

typescript
new Node(options: NodeOptions)

NodeOptions

参数类型说明
configMNode节点配置
parentNode父节点(可选)
pagePage所属页面
appApp应用实例

属性

属性类型说明
dataMNode节点配置数据
styleobject节点样式
eventsEventConfig[]事件配置
instanceany组件实例
pagePage所属页面
parentNode | undefined父节点
appApp应用实例
storeStore节点存储
eventKeysMap<string, symbol>事件键映射

实例方法

setData

  • 参数:

    • {MNode} data 节点数据
  • 返回:

    • {void}
  • 详情:

    设置节点数据,会更新 datastyleevents 属性。

  • 示例:

typescript
node.setData({
  id: 'button_1',
  type: 'button',
  style: { width: 100 },
  events: []
});

addEventToQueue

  • 参数:

    • {EventConfig} event 事件配置
  • 返回:

    • {void}
  • 详情:

    将事件添加到事件队列,等待绑定到组件实例。

setInstance

  • 参数:

    • {any} instance 组件实例
  • 返回:

    • {void}
  • 详情:

    设置组件实例,并绑定队列中的事件。

  • 示例:

typescript
// 通常在组件挂载时调用
node.setInstance(componentInstance);

runHookCode

  • 参数:

    • {'created' | 'mounted'} hook 钩子名称
    • {object} params 参数
  • 返回:

    • {Promise<any>}
  • 详情:

    执行节点的钩子代码。

  • 示例:

typescript
await node.runHookCode('mounted', { data: someData });

destroy

  • 返回:

    • {void}
  • 详情:

    销毁节点,清理事件监听和组件实例。

生命周期事件

Node 实例会触发以下生命周期事件:

事件名说明
created组件创建完成时触发
mounted组件挂载完成时触发
destroy组件销毁时触发
update-data数据更新时触发

监听示例

typescript
node.on('mounted', () => {
  console.log('组件已挂载');
});

node.on('update-data', (newData) => {
  console.log('数据已更新', newData);
});

Powered by 腾讯视频会员平台技术中心