@envision-digital/template-builder-sdk

1. 描述

此为 EnOS Template Builder SDK 使用说明文档，使用此SDK可以与 统一模板库 页面建立通信（同域通信）。

2. 安装

使用 yarn

yarn add @envision-digital/template-builder-sdk

使用 npm

npm install @envision-digital/template-builder-sdk

3 使用

3.1 以组件方式使用

(1) 示例

import React, {useRef, useEffect} from 'react';
import {TemplateSelector} from '@envision-digital/template-builder-sdk';

const Component = () => {
    const ref = useRef(null);

    useEffect(() => {
        const frame = ref.current.getIFrame(); // 可通过此方法获取 IFrame 节点
        // ...
    }, []);

    return (
        <TemplateSelector
            ref={ref}
        />
    );
};

(2) 参数

interface TemplateSelectorProps {
	style?: React.CSSProperties; // 渲染页面 iframe 的样式
	state?: string; // 额外 url 传参
	onSelectTemplate?: (data: TemplateData) => void; // 用户选择模板后，调用此方法
}

type TemplateData = {
	id: string;
	name: I18n;
	description: I18n;
	scope: number;
	reference_type: string; // CBB Type
	reference_id: string; // CBB 侧识别的ID
	orgId: string; // ORG ID
}

4. Change Log

0.0.1

• 初始化SDK
• 提供TemplateSelector模板库组件

5. Interface

interface TemplateSelectorProps {
	style?: React.CSSProperties; // 渲染页面 iframe 的样式
	state?: string; // 额外 url 传参
	onSelectTemplate?: (data: TemplateData) => void; // 用户选择模板后，调用此方法
}

type TemplateData = {
	id: string;
	name: I18n;
	description: I18n;
	scope: number;
	reference_type: string; // CBB Type
	reference_id: string; // CBB 侧识别的ID
	orgId: string; // ORG ID
}