交互配置

更新时间:

物联网应用开发配置组件时,可设置事件和动作实现组件的动作交互。事件触发时,按照交互动作配置的先后顺序依次执行相应的动作。

支持的事件和动作

image

  • 事件:包括单击、双击、鼠标移入、鼠标移出、值改变、聚焦、失焦等。

  • 动作执行模式:包括同时执行(默认)和按顺序执行。

  • 动作:包括设置设备属性、调用设备服务、打开链接、刷新组件、赋值给页面变量、展示或隐藏组件、调用其他服务和打开弹窗容器。动作具体配置,请参见下文介绍。

使用限制

  • 支持多个交互动作使用同一个触发事件,多个动作的执行模式支持为同时执行(默认)和按顺序执行

  • 动作执行模式为按顺序执行时,如果子动作当前页面打开链接子动作执行失败,则后续子动作不会再执行。

  • 一个组件最多支持20个交互动作,一个触发事件支持最多20个交互子动作。

设置设备属性

触发事件时,设置组件关联设备的属性。

设置设备属性

  1. 选择触发事件,选择动作为设置设备属性

  2. 单击配置设备

  3. 设置设备属性页面,配置设备信息,单击保存

    说明

    保存设置前,可单击验证对相关配置进行验证。

    参数

    描述

    选择产品

    选择该组件对应的设备所属产品。

    选择设备

    选择该组件对应的设备。

    • 指定设备:如果已有真实设备连接到物联网平台,则选择真实设备。如果真实设备未连接到物联网平台,没有上报数据,则需使用设备模拟器功能,在线模拟上报数据进行数据格式验证。具体操作,请参见设备模拟器

    • 动态设备:可选页面变量、组件值、URL参数和来自交互动作四种类型的动态设备。

      • 页面变量:选择在当前应用中,已创建的页面变量作为动态设备来源。创建页面变量具体操作,请参见页面变量管理

      • 组件值:选择当前应用中,已配置的表单组件作为动态设备来源。

      • URL参数:以最终发布页面上的某个参数作为该服务的动态设备。常用于嵌入页面时,由宿主页提供动态参数,如将传入的产品型号作为服务的动态设备。

      • 来自交互动作:最终以交互页签配置的弹窗数据源,作为动态设备来源。详细信息,请参见打开弹窗容器

        重要
        • 仅弹窗组件支持将动态设备选择为来自交互动作

        • 必须在单击配置数据源打开数据源配置弹窗后,设置设备项为动态设备

    • 空设备:若选择为空,可在设备模拟数据框中,输入模拟数据,进行数据格式验证。

    选择属性

    选择该组件对应的属性。

    设置值

    需根据所选设备属性的取值范围,设置模拟值。

    支持配置动态数据源,单击参数来源,可选:

    说明

    IoT Studio目前仅支持调用强校验类型的物模型数据。参数来源的数据必须满足属性或服务的物模型定义配置。有关物模型数据校验的详细说明,请参见校验物模型数据

    • 组件值:选择当前应用中,已配置的表单组件作为参数值来源。

    • URL参数:将当前组件所属页面最终发布的URL地址中的某个URL参数的key值配置为此处的URL参数。页面运行时,会自动获取页面中对应URL参数的value值。

    • 页面变量:选择在当前应用中,已创建的页面变量作为参数值来源。创建页面变量具体操作,请参见页面变量管理

    属性取值范围,请在产品详情页的功能定义中查看。

调用设备服务

触发事件时,调用来自产品功能定义的服务。

调用设备服务

  1. 选择触发事件,选择动作为调用设备服务

  2. 单击配置服务

  3. 调用设备服务页面,配置设备服务,单击保存

    说明

    保存设置前,可单击验证对相关配置进行验证。

    参数

    描述

    选择产品

    选择该组件对应的设备所属产品。

    选择设备

    选择该组件对应的设备。详细说明,请参见上文“设置设备属性”中的参数描述。

    选择服务

    选择该组件对应的服务,然后设置相关参数。服务来自产品的功能定义

打开链接

触发事件时,打开配置的链接。

打开链接

  1. 选择触发事件,选择动作为打开链接

  2. 单击选择链接

  3. 在弹出的对话框中,配置链接,单击确定

    参数

    说明

    链接打开方式

    可选:

    • 当前页面:在当前应用页面打开链接。

    • 新开页面:在新开页面打开链接。

    目标链接

    可选:

    • 当前应用页面:设置当前应用中的某个页面为链接目标页。

    • 指定链接:设置外部链接为链接目标页。输入链接需以http://https://开头。

    URL参数

    鼠标指针移动到URL参数右侧的帮助图标,可查看URL键值对配置说明。

    单击+URL参数,配置

    支持配置动态参数,单击参数来源,选择来源类型进行配置。

    其中组件值、URL参数、页面变量的详细说明,请参见上文“设置设备属性”中的参数描述。

    登录账号:在开启应用账号鉴权的情况下。配置数据分析服务自定义接口业务逻辑开发时,可以选择登录的账号信息作为请求参数,以完成一些界面或功能的定制需求。详细使用说明,请参见账号数据

刷新组件

触发事件时,会刷新组件数据源。

重要

对于控制组件和表单组件的展示内容或状态,如果用户手动更新的组件内容或状态与组件数据源返回结果不一致,则组件展示内容或状态以组件数据源结果为准。

刷新组件

  1. 选择触发事件,选择动作为刷新组件

  2. 设置需要刷新的组件,可多选。

赋值给页面变量

触发事件时,为页面变量赋值。

为变量赋值

  1. 选择触发事件,选择动作为赋值给页面变量

  2. (可选)若还没有创建对应页面变量,单击管理页面变量,单击新增页面变量,输入页面变量信息,单击确认,返回交互页签。

  3. 单击配置

  4. 在弹出对话框中,单击赋值,选择组件的页面变量值。

    可选择为组件的对应值,或输入自定义的固定值。

  5. 选择要赋值的页面变量,单击确定

展示隐藏

触发事件时,控制其他组件的展示和隐藏。

展示隐藏

  1. 选择触发事件,选择动作为展示隐藏

  2. 设置点击出现的组件和点击隐藏的组件。均可多选。

调用其他服务

触发事件时,调用自定义接口、本项目内业务逻辑开发或产品与物的管理接口。

调用其他服务

  1. 选择触发事件,选择动作为调用其他服务

  2. 单击选择服务

  3. 服务配置对话框中,配置要调用的接口。

    参数

    说明

    接口来源

    选择要调用的服务。

    • 自定义接口:调用开发者自己开发的开放接口或第三方接口。

      重要

      自定义接口必须满足以下要求:

      • 如果设置了请求参数,该参数必须使用JSON格式数据。

      • 接口返回的数据必须是JSON格式的。

      • 调用自定义接口,最大超时时间为10秒。若10秒内未收到接口返回的数据,则返回超时错误。

      支持的JSON的数据格式有:

      • 对象(Object):{}

      • 数组(Array):[]

      • 字符串(string):"test"

      • 数字(number):123

      • 布尔值(bool):truefalse

    • 业务逻辑开发:调用在当前项目中,通过业务逻辑开发的HTTP接口。

    • 产品与物的管理:调用查询产品信息列表接口、查询产品属性接口、查询物的详情列表接口或查询物的数量接口。

    请求方法

    选择自定义接口的请求方法,可选:getpost

    当接口来源选择为自定义接口时出现的参数。

    请求地址

    输入您的自定义接口的请求地址。

    当接口来源选择为自定义接口时出现的参数。

    选择接口

    选择要调用的接口。

    当接口来源选择为业务逻辑开发产品与物的管理时出现的参数。

    请求参数

    可选:

    • 静态参数:需在下方输入框中,填入键值对组成的请求参数,格式需为标准的JSON格式。

    • 动态参数:需在下方添加请求参数,设置键和值。

      支持配置动态参数,单击参数来源,可选组件值、URL参数、页面变量或登录账号。详细说明请参见上文“打开链接”中的参数描述。

打开弹窗容器

触发事件时,打开弹窗组件。

弹窗

  1. 选择触发事件,选择动作为打开弹窗容器

  2. 设置需要打开的弹窗组件。

  3. 如果弹窗组件配置了数据源,单击配置弹窗数据源。在对话框数据源配置面板,您可以再次修改弹窗组件已配置的数据源,然后单击确定

    说明

    只有弹窗组件配置了静态数据源、来自交互动作的接口数据源或来自交互动作的动态设备数据源,才可以再次修改弹窗组件已配置的数据源。更多信息,请参见设备接口静态数据