Host API

host.js 的运行环境中，我们提供了一个全局变量 hostApi，在 hostApi 上封装实现了相应的 API，以便实现与 Pixso 的交互，详细内容如下：

Event

hostApi 提供了 on、 once、 off 三个接口来注册、移除事件监听，目前支持的事件类型如下：

• mounted：host.js 加载后触发；
• beforeunmount：host.js 卸载前触发，如：
• • 关闭配置有 host.js 的插件；
• • Pixso 退出设计模式；

type HostArgFreeEventType =
  | "mounted"
  | "beforeunmount"
  | "selectionchange"
  | "currentpagechange"
  | "documentfirstpaint";

on

• type: on(type: HostArgFreeEventType, callback: () => void): void;

on 方法允许注册特定事件的处理函数，当事件发生时会执行该回调函数

---

once

• type: once(type: HostArgFreeEventType, callback: () => void): void;

once 方法允许注册特定事件的处理函数，当事件发生时会执行该回调函数。与 on 方法的区别在于，通过 once 方法注册的事件处理函数只会执行一次。

---

off

• type: off(type: HostArgFreeEventType, callback: () => void): void;

移除通过 hostApi.on 或 hostApi.once 绑定的事件处理函数。

Sandbox-related

此分类下的接口只在插件下运行的 host.js 中有效，主要用于与插件的 sandbox.js 进行通信。

sandbox.postMessage

• type: postMessage: (message: any) => void

由 host.js 向 sandbox.js 发送消息。

---

sandbox.onmessage

• type: Function | undefined

监听 sandbox.js 向 host.js 发送的消息。

---

sandbox.on

• type: on: (event: 'message', cb: (event: any) => void) => void

监听 sandbox.js 向 host.js 发送的消息。

---

sandbox.once

• type: once: (event: 'message', cb: (event: any) => void) => void

监听 sandbox.js 向 host.js 发送的消息，回调函数运行一次后便移除监听。

---

sandbox.off

• type: off: (event: 'message', cb: (event: any) => void) => void

移除通过 sandbox.on 或 sandbox.once 接口绑定的监听。

Node-related

getFramesByLevel

• type: getFramesByLevel(level: number): Promise<FramesByLevel>

type FramesByLevel = {
  pageID: string;
  pageName: string;
  frames: {
    id: string;
    level: number;
    name: string;
    parentID: string;
    parentName: string;
    type: NodeType;
  }[];
};

获取指定层级下的所有画板。

---

getSelection

• type: getSelection(): Promise<{id: string, name: string, type: NodeType}[]>
• Type Declaration: NodeType

获取当前选中图层。

---

setSelection

• type: setSelection(guids: string[]): Promise<void>

---

设置当前选中图层。

getCurrentPage

• type: getCurrentPage(): Promise<{id: string, name: string, type: NodeType}>
• Type Declaration: NodeType

获取当前页面。

---

setCurrentPage

• type: setCurrentPage(guid: string): Promise<void>

设置当前页面。

---

scrollAndZoomIntoView

• type: scrollAndZoomIntoView(guids: string[]): Promise<void>

定位指定图层。

Others

showPluginDockAsync

• type: showPluginDockAsync(): Promise<void>

显示插件坞。

setLibraryConfig

• type: setLibraryConfig(config: Partial<LibraryConfig>): void

设置资源库相关 UI 显隐

interface LibraryConfig {
  enabled_team_library: boolean; // 一键关闭团队资源库
  enabled_ent_library: boolean; // 一键关闭企业资源库

  enabled_team_left_component_panel: boolean; // 是否启用团队左侧组件面板
  enabled_ent_left_component_panel: boolean; // 是否启用企业左侧组件面板

  enabled_team_instance_replace: boolean; // 是否启用团队实例替换
  enabled_ent_instance_replace: boolean; // 是否启用企业实例替换

  enabled_team_style_replace: boolean; // 是否启用团队样式替换
  enabled_ent_style_replace: boolean; // 是否启用企业样式替换

  enabled_team_library_tab: boolean; // 是否启用团队资源库发布页
  enabled_ent_library_tab: boolean; // 是否启用企业资源库发布页

  enabled_team_library_publish: boolean; // 是否启用团队资源库发布
  enabled_ent_library_publish: boolean; // 是否启用企业资源库发布

  enabled_team_library_replace: boolean; // 是否启用团队资源库替换
  enabled_ent_library_replace: boolean; // 是否启用企业资源库替换

  enabled_library_missing_replace: boolean; // 是否启用缺失资源库替换功能

  enabled_dev_mode: boolean; // 是否启用研发模式开关
}

---

getVersionId [2.0 已弃用]

getVersionIdAsync

• type: getVersionIdAsync(): Promise<string>

获取当前历史版本的 ID。

setBar

• type: setBar(config: CustomBarType[] ): void

设置右下角自定义按钮

export type CustomBarType = {
  callback: () => void; // 点击回调
  imgUrl: string; // 图片链接 (24*24)
  desc?: string; // 描述
};