Skip to Content

使用变量与参数

在应用运行期间,变量用于临时存储与复用内部状态,而参数用于在页面跳转或逻辑节点之间安全地传递信息。

本指南将带您掌握如何在实际项目中对这五种数据容器进行定义(声明)、赋值以及引用。

💡 在阅读本指南前,强烈建议先阅读 变量和参数,以便彻底理解不同变量和参数的作用域与生命周期。


1. 变量的使用指引

变量的使用严格遵循“定义范围 → 触发赋值 → 页面引用”的三步工作流。

1.1 页面变量

页面变量通常用来在当前激活的页面内部传递、暂存各种中转信息或控制显示状态。

声明页面变量

  1. 在编辑器中打开目标页面,在右侧属性面板中切换到“数据”选项卡。
  2. 在“页面变量”中点击添加,设置变量名称和数据类型(支持文本、整数、布尔、日期、JSONB 等)。
  3. 设定可选的默认值。
页面变量定义界面

触发变量赋值

  1. 选中触发数据改变的页面组件(如:某个输入框,或一个“确认选择”按钮)。
  2. 在其属性面板的“行为”选项卡下添加动作。选择 “设置页面变量” 行为。
  3. 选中您刚刚创建 of 页面变量,并为其绑定新值(可以绑定为当前输入框的最新输入,或直接写入一个确定值)。

在页面内引用变量

  • 页面变量创建和赋值后,便可以直接被当前页面内的其他所有组件内容、条件容器控制条件以及动作链节点进行引用。例如:列表组件的数据源过滤条件中,可以设置“博客表.标题 包含 页面变量.search_keyword”。

1.2 客户端变量

客户端变量是跨页面生效的全局状态,只要不关闭浏览器(Web 端)或不关闭应用会话,其数值便能持续复用。

声明客户端变量

  1. 点击项目顶部导航栏的 “设置” → “客户端变量”
  2. 添加变量,设置名称与数据类型。由于客户端变量可能在页面未加载时即被调用,推荐为其配置合理的初始默认值(如配置用户默认语言 lang 的值为 "zh_CN")。

客户端变量赋值

  1. 客户端变量在页面中是随时可写的。
  2. 在组件点击等行为流节点上,添加 “设置客户端变量” 动作。
  3. 将最新的计算值或系统变量(如当前登录用户的手机号)写入客户端变量中。

跨页面直接引用

  • 任何页面上的任意组件,均可以通过数据绑定直接拉取该变量。例如:在“个人中心页”和“全局导航页”中,直接将文本组件绑定到 客户端变量.user_nickname 来同步显示用户姓名。

2. 页面参数的使用指引

页面参数(路径参数与查询参数)是进行跨页面数据传递的唯一官方信息通道。

2.1 路径参数 —— 详情页与搜索引擎优化 (SEO)

路径参数是页面网址主路径的一部分。例如:/blog/:blog_id 路由中的 :blog_id,它通常被用于拉取详情。

声明路径参数

  1. 新建或进入博客详情页面。
  2. 在右侧“数据”面板中,添加 “路径参数”(如参数名命名为 blog_id)。
  3. 路径参数在声明后,会自动合并到该页面的主路由结构中。由于路径参数是页面路由的基础,因此在跳转时它是必填的

参数声明示意图

触发跳转并赋值

  1. 回到“博客列表页”,选中列表项或其中的“阅读详情”按钮。
  2. 为该按钮绑定 “页面跳转” 行为,跳转目标选择刚刚配置的“博客详情页”。
  3. 此时,发布面板中会强制要求您为路径参数 blog_id 进行赋值。
  4. 数据绑定:将当前被点击列表项的 id(即 item.id)直接绑定赋值给 blog_id

参数赋值示意图

参数引用与数据过滤

  1. 重新进入“博客详情页”,点击该详情页的数据源配置。
  2. 为详情页的数据源设置过滤条件:指定获取博客表的记录条件为 id 等于 “路径参数 → blog_id”
  3. 将该数据源的限额设置为 1。这样,页面在加载时便能根据传递过来的 ID 精准获取对应博客的完整详情。

参数引用示意图


2.2 查询参数 —— 临时筛选与跟踪

查询参数是附加在链接后的临时状态(如 ?utm_source=promotion)。它不影响页面的主路由加载。

声明查询参数

在列表展示页面或搜索结果页的数据配置中,添加“查询参数”(如命名为 category_filter),该参数通常是选填的,可以为空。

页面跳转或行为中传值

在首页推荐位广告的“页面跳转”动作中,跳转到产品列表页,并为其查询参数 category_filter 赋值传入特定分类的名称。

绑定为过滤条件

在产品列表页的数据源查询中,添加过滤条件:当 查询参数.category_filter 不为空时,产品表分类等于该查询参数。由于查询参数是选填的,当不带参数直接打开列表页时,该条件自动被忽略,从而实现完美的全列表兼容展示。


3. 行为输入参数的使用指引

行为参数专门用于将前端组件收集的动态数据,安全地注入传递给后端的“行为流”或“ZAI 智能体”进行高级逻辑加工。

在后台声明输入参数

  1. 在行为流或 ZAI 配置画布中,打开输入设置。
  2. 声明流程运行所需的入参(例如:创建订单行为流,声明需要 product_idquantity)。

内部逻辑节点引用

  • 在行为流内部的各个处理步骤中(如计算金额、扣减库存、创建订单表记录),您可以直接把这些声明的入参当作输入源进行绑定。

行为输入引用示意图

前台触发时进行传值

  1. 回到前台页面,选中点击触发该逻辑流的按钮(如“立即下单”)。
  2. 在行为中添加“调用行为流”动作。
  3. 此时系统会自动拉取行为流定义的参数口。
  4. 绑定前台数据:把商品列表中的 item.id 和步进器中的输入值,分别赋值传递给后端入参 product_idquantity
行为输入赋值示意图
Last updated on