交互配置

更新时间:
复制 MD 格式

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

支持的事件和动作

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

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

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

使用限制

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

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

  • 一个组件最多支持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):true、false

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

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

    请求方法

    选择自定义接口的请求方法,可选:get、post。

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

    请求地址

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

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

    选择接口

    选择要调用的接口。

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

    请求参数

    可选:

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

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

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

打开弹窗容器

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

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

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

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

    说明

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