Skip to main content

变量使用说明

本文介绍一下变量及其使用。

变量功能介绍

新建变量

进入应用编辑器页面,单击左上方的变量 > 新建变量 选择合适的变量类型。

参数参数说明
变量名变量唯一的名称,可用于变量引用。
变量类型支持选择文本(String)、数字(Number)、布尔值(Boolean)、数组(Array)、对象(Object)。
数据模型变量类型为数组或对象时,选择数据的字段结构。
初始值变量的初始值,不同数据类型存在不同的初始值写法,示例如下:
  • String:test
  • Number:123456
  • Boolean:false
  • Array:[1,2,3]
  • Object:{key:"test",val:2}
  • 作用域选择变量生效的作用域,有全局和指定页面。
    备注变量的使用说明,根据使用场景自定义填写。

    组件绑定变量

    1. 单击绑定表达式图标。
    2. 选择变量 test。
    3. 单击保存

    变量赋值

    对变量进行赋值,从而实现组件的动态控制,如下将 test 变量赋值为123

    路径一:通过事件变量赋值方法动态赋值变量

    适用于通用场景,无需代码轻松完成变量赋值:

    1. 单击配置事件。
    2. 选择变量赋值。
    3. 改变变量的值后,单击保存。

    路径二:通过事件自定义 Javascript 方法动态赋值变量

    适用于定制逻辑,需自定义代码 JS 代码的专业开发者修改为针对需要自定义 JS 代码的专业开发者。首先复制变量路径: 然后在自定义 JS 方法中对变量进行赋值(代码编辑器 > 页面 handle > 新建自定义 JS 方法(Javascript)):

    应用示例

    示例一: 文本组件绑定展示文本变量的值

    新建一个 test 变量,类型为 string,默认值为 test,并绑定到一个文本组件中展示。

    1. 进入应用编辑器页面,单击左上方的变量,创建一个全局的变量变量标识为 test,数据类型选 String,初始值填写为 test。
    2. 进入组件右侧配置区中单击绑定表达式,以文本组件展示内容配置项为例。在弹出的表达式浮层中,选择刚刚创建的 test 普通变量后单击绑定进行保存。
    3. 保存完成后可以看到,文本组件的展示值已变更为 test,这样我们便完成了组件配置区的数据绑定。

    新版变量 VS 旧版变量

    2022 年 10 月 21 日,微搭发布了编辑器新版本。如下描述新老版本的功能和使用对比: 老版本的变量类型分为“模型变量”、“普通变量”、“参数变量”,新版本变量类型为 文本、数字、布尔值、对象、数组。能力与老版本完全兼容,详见如下:

    • 原”参数变量“ 实际是页面间传递的参数,使用说明详见 页面间跳转参数配置
    • 原“模型变量”: 即模型支持初始化方法,方便首次获取数据(选择变量类型、数据模型和变量初始化方法)
    • 原“普通变量” 即支持自定义数据类型,入口保留在选择模型,下拉至底选择 JSON。