SDK 说明文档
PS:Visual SDK 采用 postMessage 作为消息通信机制
The APIs
调用示例
// import api from sdk
import { print, preview, pdf, copy } from '@skylla/sdk/api';
// use print
print({ host, query }, { resource, content });
消息监听 与 消息发送
// import message api from sdk
import { bindMessage, sendMessage } from '@skylla/sdk/api';
// 全局唯一消息绑定
await bindMessage({
// 例:监听打印完成状态
async onPrintComplete() {
/* do something ... */
},
});
// 在需要时发送消息
await sendMessage({
mode: 'onPrintWork',
data: {
/* params */
},
});
设计风格
1. SDK 所提供 API,均以 async/await 风格编写
2. 响应监听的命名风格:`on${Api}Complete`,如:onPrintComplete
完整调用示例
// import api from sdk
import { print, preview, pdf, copy } from '@skylla/sdk/api';
// Set Host
const host = 'https://lcp.qianjiangcloud.com';
// Set Query
const query = { id: 100 };
// 打印
await print({ host, query }, content);
// 预览
await preview({ host, query }, content, { width, height });
// PDF(返回 PDF 流)
await pdf({ host, query }, content);
// 拷贝 ID
await copy({ host, query });
加载平台相关事件(iframe)
await bindMessage({
// 当平台界面完成初始化工作后,会向调用方发送 message
async onVisualReady() {
await sendMessage({ mode: 'onVisualWork', data: { /* any */ } }, <iframe.contentWindow>);
}
});
VUE
import { dragger, iVueFrame, resizable, VueDraggable, VueDraggableDirective } from '@skylla/sdk/vue';