本文档示例为开发者的自定义组件提供功能开发的参考,主要介绍三个蓝图编辑器内容的实现方法:事件触发、导入数据接口、添加交互动作。
前提条件
本文档功能实现需要用户操作使用桌面版开发工具,详情请参见开发工具使用说明中的桌面版开发工具使用说明。
背景信息
本文档适用用户在开发自定义组件的时候,为了使得自定义组件能同样使用DataV中蓝图编辑器的功能,需要使用与蓝图编辑器一致的规则开发自定义组件。在使用开发者工具创建完成组件后,本地的组件包文件夹下会生成index.js和package.json文件,本文三点内容的实现需要在这两个文件中修改内容来操作。
理解交互功能
当前案例实现需要用户将交互转成节点和边的关联关系,需要使用的组件有满足需求的事件和动作才能进行配置,否则就无法实现。
- 组件:组件包含两种能力,事件抛出能力和动作执行能力。本案例使用了数字翻牌器组件来举例说明。
- 蓝图编辑器:通过运用逻辑节点编排的方式,将上游组件的交互/事件与下游组件的执行动作绑定,从而实现页面内组件间的交互联动。
说明 蓝图编辑器配置完成后需要在预览页查看配置效果。
事件触发
在自定义组件中实现蓝图编辑器中事件触发功能,以下图数字翻牌器组件的当前值变化事件为例。

导入数据接口
在自定义组件中实现蓝图编辑器中导入数据接口动作,以下图数字翻牌器组件的导入数据接口动作为例。

添加交互动作
在自定义组件中实现蓝图编辑器中多个交互动作,以下图数字翻牌器组件的显示和隐藏动作为例。
