资讯动态

Axure变量教程:全局变量、局部变量与中继器交互实战避坑

发布时间:2026/10/15 4:37:13 来源:尧图企业网站定制
简介Axure RP的变量与函数体系是复杂原型交互的基石这份PDF面向具备一定Axure基础的产品经理、UI/UX设计师及前端原型开发人员系统解决跨页面数据传递、动态列表生成、响应式布局调整与鼠标交互响应等实现难题。内容按全局变量、中继器数据集、元件、页面、窗口、鼠标指针及数值/字符串/日期处理函数等分类展开逐一说明变量类型、核心函数与应用场景例如利用中继器行函数与itemCount、pageIndex实现列表索引和分页控制借助页面宽度条件切换布局结合布尔逻辑构建交互分支。同时提供了大量可直接套用的表达式示例覆盖跨页面传参、动态内容显示、窗口滚动触发等典型需求并针对命名规范、作用域管理和数据类型匹配给出明确提醒有助于提升原型逻辑严谨性与可维护性。资源为单个PDF文件体积仅556KB目前已有216人学习下载适合边学边练、对照Axure软件实际操作。1. Axure变量到底解决什么从静态原型到状态可验证的交互原型原型评审时最常被问的一句话是“这个按钮点完会发生什么”。静态原型答不上来变量能。Axure变量是跟着原型走的一个存储位把数据放进去之后页面与页面之间、元件与元件之间就可以共享这段数据。反直觉的是原型复杂度越高变量越不是“高级功能”而是必需品。登录态、列表选中项、表单草稿、流程状态缺了变量就只能把每个页面画死评审时全靠嘴上补流程。这篇文章面向要把原型做成可点、可验证状态流转的产品经理和交互设计师读完能按套路把变量接到文本、表单、页面跳转和中继器里也能绕开那些常见的值不更新、表达式报错问题。2. 三种变量形态全局变量、局部变量、内置函数与属性分别用在哪儿做原型之前先想清楚一个问题这份数据要活多久是只在当前交互里用一下还是跨页面共享又或者是系统自带的能力。想清楚了才知道该用全局变量、局部变量还是内置函数。很多人上来就在全局变量表里堆名字结果原型做到一半变量面板变得没法看改一个名字要全局搜半天。这三个概念分开聊每类都有自己的适用边界。2.1 全局变量跨页面共享数据的主通道全局变量是Axure里唯一能跨页面读写的数据载体。它属于整个原型文件创建之后任何页面的任何交互都能引用。入口在高版本Axure RP的“项目”菜单下点“全局变量”打开一个列表也可以在顶部工具栏的“项目”面板里快速进入。新建变量很简单点加号填变量名和默认值确定就生效了。操作步骤打开“项目 全局变量”对话框。点左下角“”新建一个变量。变量名填userName默认值填访客。确定后关闭对话框。默认值不是摆设。原型首次加载时变量会带着这个值出场相当于给数据一个初始状态。比如用户还没登录的时候userName就显示“访客”登录后再把它赋值为真实用户名。需要注意的是全局变量在浏览器标签页里存活刷新页面或关闭标签页后重新打开原型变量会回到默认值但从A页面跳到B页面值不会丢。这个生命周期决定了它适合放“登录用户名”“购物车数量”“当前流程步骤”这类跨页面状态。实际操作里我见过最多的问题是把所有中间计算结果都塞进全局变量。比如某页面内部算一个临时合计算完就没人再用了也建了个全局变量存着。这种数据不需要跨页面放在全局变量表里只会增加维护成本。判断标准就一条除了当前页面之外还有没有别的页面或别的交互要读这个值没有就别进全局变量。还有一个新手容易困惑的点新建原型文件时全局变量表里默认有一个OnLoadVariable。它不是系统保留字也不是特殊变量只是一个普通全局变量。之所以叫这个名字是因为常见用法是在页面加载事件里给它赋值然后让页面上的其他元件读取它。你可以保留也可以改名甚至删掉重见都不影响功能。2.2 局部变量单次交互里的临时引用局部变量和全局变量的存在形式完全不同。你在全局变量对话框里找不到它它只活在某个交互动作的表达式编辑器里。最常见的入口是点击某个“设置文本”“设置变量值”动作右侧的fx按钮在弹出的编辑器下方有“添加局部变量”。它的作用是在这一个动作里临时给某个元件或某个值起个短名字方便在表达式里反复引用。举个例子。界面上有两个输入框一个填姓名一个填电话下面有个标签要显示“张三的电话是13800000000”。按照全局变量的思路要先建两个全局变量再分别赋值再做文本拼接很绕。用局部变量一个“设置文本”动作就够。操作步骤画布上放两个文本框分别命名inputName、inputPhone。再放一个文本标签选中后添加交互事件“设置文本”。“设置文本为”一栏点fx进入表达式编辑器。点击编辑器里的“添加局部变量”创建局部变量name值设置为“元件文字”并选择inputName。再创建局部变量phone值设置为“元件文字”并选择inputPhone。表达式写[[name]]的电话是[[phone]]。这个例子里局部变量只在这个“设置文本”动作里有效。换一个按钮事件想再引用name这个局部变量是找不到的必须重新添加。看起来像缺点但这正是它的价值不需要为了一个页面的展示逻辑去污染全局变量表表达式本身也短了很多。局部变量的用途不止是元件文字。Axure里可以在添加局部变量时选择界面元件、元件属性、选中状态、可见性甚至会用到中继器的Item属性。凡是“当前这个交互动作里临时需要用一下”的数据都优先考虑局部变量。跨动作、跨页面需要复用的才升级成全局变量。2.3 内置函数与属性被当成变量的系统能力还有一类数据经常被人误认为是变量其实就是内置函数和属性。比如显示“当前是哪个页面”有人去全局变量表里找PageName找不到然后怀疑自己创建错了。它的真面目是系统提供的函数调用时返回当前页面名称。这类函数不需要创建也不需要赋值直接在表达式里用双中括号包起来就行。常用的内置函数和属性可以列成一张速查表表达式作用返回结果示例[[PageName]]当前页面名称“首页”[[Now]]当前日期时间2025/1/12 14:30:00[[Random]]0到1之间的随机数0.7234[[变量名.length]]获取某个字符串的字符长度5[[text.trim()]]清除字符串两端空格“admin”从用法上看函数和变量几乎一样写在双中括号里就能被解析。但从思维方式上要区分开变量存的是“已经放进去的值”不重新赋值就不会变函数每次执行时现场计算结果随条件变化。比如[[Random]]在同一个用例里被引用两次两次拿到的随机数都不一样。理解这一点排查时思路会清晰很多。还有一类属性是加在局部变量或全局变量后面的比如[[userName.length]]能拿到字符串长度[[Item.产品名称]]能拿到中继器当前行的产品列数据。这些都不是你自己创建的变量而是对象自带的属性。写表达式时不需要提前声明但要注意区分英文字符的大小写Axure里函数名和内置属性对大小写敏感。3. 变量赋值与读取的最小闭环设置文本、设置变量值、条件判断变量本身看不见摸不着它必须通过界面元件或交互条件体现出来。完整的变量用法本质上就是两个动作循环把界面上的值写进变量把变量里的值显示回界面。中间再穿插条件判断让原型根据变量内容走不同的分支。这一章直接搭一个最小闭环从输出到输入再到判断每一步都配上具体操作。3.1 把变量输出到界面[[变量名]]的写法变量要显示在界面上最简单的方式就是在文本里写双中括号包裹的变量名。新建一个全局变量userName默认值填“访客”然后在画布上放一个文本标签双击进入编辑状态输入下面这段欢迎您[[userName]]预览时这个标签会直接显示“欢迎您访客”。换个场景如果你在登录页把userName赋成了“张三”切到首页时同一个表达式会显示“欢迎您张三”。这就是变量和写死的文本最大的区别文本内容不变但变量的值变了界面上显示的内容也跟着变。表达式不只支持单变量也支持拼接。常常有这种需求一段提示语里夹着多个变量。写法还是在一行文本里并列放多个双中括号订单号[[orderNo]] 今日下单量[[orderCount]] 单 账户余额[[balance]] 元这里有个很容易翻车的细节Axure只会解析成对的双层中括号。如果用成了单层中括号、全角括号或者变量名前多打了一个空格预览时页面上就会原样显示“[[userName]]”这串字而不是变量值。排查这种问题时先把表达式复制到记事本里肉眼检查括号是否成对、是否半角、变量名是否和全局变量表里完全一致。这类问题占了变量“不生效”报错的一大半。变量参与计算时同样在表达式里写运算。比如全局变量price存单价count存数量想在标签上显示总价表达式写[[price * count]]Axure会把price和count按数值解析并相乘。这里要提醒的是如果变量值里带了“元”“件”这类中文单位数值计算会直接失败。所以存数据时尽量只存纯数值单位留在界面文本里拼。3.2 从界面把值写进变量输入框、下拉框和选项组变量不能只用来显示还要能从界面上收集数据。常见场景是登录弹窗用户在输入框里填了用户名点“登录”按钮值要被写进全局变量后续页面才能根据这个值做个性化显示。这个动作叫“设置变量值”入口是按钮的“单击时”交互。操作步骤画布上放一个文本框命名inputUser。放一个登录按钮选中后新建交互“单击时”。在用例里添加动作“设置变量值”。目标变量选择全局变量userInfo。点击“值”一栏的fx进入表达式编辑器添加局部变量temp值设置为“元件文字”并选择inputUser。表达式填[[temp]]确定保存。这段操作里有个关键点不是直接在值里写死“张三”而是通过局部变量把输入框当前内容“抓”出来再写入全局变量。局部变量在这里相当于一个中转抓手让表达式可以引用界面元件的动态内容。写完之后再添加一个“设置文本”动作把某个标签的内容设置为[[userInfo]]预览时输入名字点登录标签就会即时显示刚输入的值。这样一个“界面→变量→界面”的闭环就完整了。动作是有顺序的Axure从上到下执行同一个用例里的多个动作设置变量值必须放在使用这个变量的动作之前否则后一个动作读到的是旧值。除了文本框下拉框和单选组也是一样的套路。下拉框用“选中选项文字”或“选中选项值”作为局部变量的取值来源单选组用“选中选项的标签文字”。交互设计里经常要收集用户偏好这些控件的取值逻辑比文本框更稳定因为没有自由输入值一定在预设范围内变量基本上不会收到奇怪的脏数据。3.3 用条件判断让变量参与流程条件用例的搭建顺序变量真正的威力是驱动流程分支。还是用登录场景如果userInfo等于“admin”跳转到后台页否则提示“用户名错误”。这里的核心不是跳转动作而是“条件Case”的搭建方式。操作步骤选中登录按钮在“单击时”事件下先不添加动作而是点击“启用Case”旁边的条件设置区。设置条件变量值 userInfo等于值 admin。在这个带条件的Case下面添加动作“打开链接”目标后台页面。再在事件下新建一个不带任何条件的Case添加动作“设置文本”让错误提示标签显示“用户名错误”。为什么要把不带条件的Case放最后因为Axure的判断机制是从上到下逐个Case匹配遇到第一个条件命中的Case就执行然后停止往下匹配。如果没有条件的Case放在最上面它永远会被优先命中下面的条件Case永远没机会执行。这个顺序问题是这个场景里最常见的坑。条件Case还可以组合多个条件。点击条件设置里的“添加条件”在“全部”和“任意”之间切换就能表达“同时满足”和“满足其一”的语义。比如判断“用户已登录且角色为管理员”两个条件用“全部”连接比单独判断用户名要准确。数值比较也要注意。条件里有两个操作数左边“变量值”右边“值”。如果变量存的是“10”右边也填“10”用“等于”比较没有问题。但如果要比较大小比如判断商品库存是否大于0建议两个操作数都走fx计算避免Axure把变量值当字符串按字典序比较。4. 页面间传参与中继器数据回写最常用的两个变量应用场景掌握了最小闭环接下来是最常被问到的两个场景列表怎么把参数传给详情页以及中继器里的一行数据怎么和全局变量互通。这两个场景覆盖了大多数后台管理原型的核心交互列表页点一行看到详情表单页提交一条新数据进表格列表里点删除或编辑要带上当前行的身份标识。全都离不开变量。4.1 列表到详情点击项怎么把参数带给下一页一个商品列表每条数据后面有一个“查看详情”按钮点击后跳到详情页详情页要显示对应商品的信息。最容易想到的做法是每个按钮写死跳转不同页面但数据一多根本不现实。标准的方案是用全局变量作为中间人点击时先把当前行的标识写进全局变量再跳转。操作步骤中继器数据表里确保有一列叫产品编号。在列表项的“查看详情”按钮上添加“单击时”交互。添加动作“设置变量值”目标全局变量selectedId值打开fx编辑器表达式填[[Item.产品编号]]。同一个用例里继续添加动作“打开链接”目标选择详情页。详情页的标题标签设置为当前商品编号[[selectedId]]。这里的核心是动作的顺序和组合设置变量值和打开链接必须放在同一个用例里并且设置变量值排在前。预览时点第一行详情页显示的是第一行的编号点第二行再返回详情页编号跟着变。这就是“参数传递”。高版本Axure的“打开链接”动作里还有一个“设置变量值可选”区域可以在配置跳转的同时直接给变量赋值不需要额外添加一个“设置变量值”动作。这两种写法效果一样我一般看团队习惯。但无论哪种方式都要注意不要在“新窗口”里打开目标页。新窗口相当于复制了一份变量空间两个标签页之间变量不互通详情页读到的很可能是上一次的旧值。这个模式的变体是打开弹窗而不是跳页。把“打开链接”换成“显示”一个动态面板其余逻辑完全一致先把当前行的参数写进全局变量再打开面板面板里的内容读取全局变量。很多“新增/编辑共用一个弹窗”的原型就是这么做的。4.2 表单提交到中继器把变量作为新行写入数据集另一个高频场景是页面上有表单用户在输入框里填内容点“提交”后这条内容以新行的方式出现在下方表格里。表格通常用中继器承载。这个流程里变量扮演的角色是“提交那一刻的数据快照”。操作步骤选中中继器在右侧“数据集”面板里确认列名是姓名、电话。画布上放两个文本框inputName、inputPhone。提交按钮“单击时”先添加动作“设置变量值”把文本框内容写入全局变量cacheName、cachePhone。再添加动作“中继器 添加行”。在添加行的配置里分别把姓名列的“值”填[[cacheName]]电话列填[[cachePhone]]。为什么不直接在中继器添加行时引文本框元件文字非要先写全局变量因为在同一个用例里动作是顺序执行的。如果你在“添加行”时直接引用元件文字然后下一个动作清空输入框执行顺序没问题但如果哪天调整了动作顺序或者输入框在提交后先被重置添加行抓到的就是空字符串。先用全局变量存一份快照等于给提交数据做了一个固定现场。这个习惯能省掉不少排查时间。添加行动作的配置里除了列名和值还要注意中继器数据集里每从“编辑列”新增。有些新手的交互配置半天但中继器右侧数据集里根本没建电话这一列添加行时找不到目标列。所以第1步不能跳。提交后的清空输入框动作可以用“设置文本”把两个文本框内容设为空字符串。这样用户在预览时看到的效果是填内容、点提交、表格多一行、输入框恢复空白。整个交互闭环才完整。4.3 中继器行内交互Item属性与局部变量配合中继器的每一行数据叫做一个Item在行内元件的事件里可以通过[[Item.列名]]访问该行任意列的值。但很多人会遇到一个问题在中继器行内的删除按钮上写[[Item.产品编号]]没问题一旦把这个表达式放到中继器之外的页面上就显示为空。这是因为Item只在它所属的中继器行元件上下文里有效中继器外部根本不认识这个对象。所以跨出中继器传递数据必须先借助全局变量做一次转存。拿“删除”按钮举例操作步骤在中继器的某一行里放一个按钮命名“删除”。按钮“单击时”添加动作“设置变量值”。目标变量deleteId值在fx编辑器中写[[Item.产品编号]]。再添加动作“中继器 删除行”配置为删除当前触发事件的行。这样点删除时界面上行消失了同时deleteId全局变量里还留着刚才删掉的那行的编号。后续如果要弹一个确认框“确定要删除编号为XX的数据吗”确认框里直接读[[deleteId]]就有了不需要在弹窗里再尝试引用Item。编辑场景同理点某行的“编辑”按钮先把这一行的[[Item.姓名]]写入全局变量editName再打开编辑弹窗弹窗里的文本框回显[[editName]]。点保存时再走一遍“设置变量值→添加行或更新行”的路子。这个组合方式本质上就是业务系统里常见的主键传递逻辑把当前操作对象的身份带到下一个界面层。5. 避坑与排查变量不生效、值对不上、表达式报错的常见问题变量相关的问题在Axure里经常被当成玄学明明配置没问题预览就是不对。这里整理了五条高频踩坑记录每条都按现象、原因、解决三步拆开。基本覆盖了变量使用中九成以上的翻车现场。5.1 页面上显示的是“[[userName]]”原文现象预览时文本标签没有显示变量值而是把表达式原样输出了。原因Axure只解析成对的双层中括号并且变量名大小写敏感。常见触发点有三个用了单层中括号中括号或引号是全角字符变量名和全局变量表里的名字不完全一致。解决把表达式复制到文本编辑器里逐字符检查括号和名称。养成习惯所有表达式一律用英文半角输入。不要把变量名起成“我的变量”这种带空格或者带中文的命名不是不能用而是很容易在表达式中混入不可见字符排查成本高。5.2 页面跳转后读到的变量是上一次的旧值现象点了第二行数据进详情页详情页显示的却是第一行的编号。原因一种是“打开链接”配置成了新窗口打开两个标签页各自持有一份全局变量副本新窗口里读到的变量来自页面加载时的初始状态。另一种是设置变量值和打开链接不在同一个用例跳转先执行了。解决跳转方式统一用“当前窗口”。打开链接时如果勾选了可选变量赋值确保赋值发生在跳转之前。如果页面里已经用了新窗口模式改成当前窗口之后重新预览验证。5.3 条件Case永远走默认分支现象条件Case设置了“用户名等于admin才跳转”但预览时不管输入什么都走进错误提示或者反过来不管输入什么都直接跳转。原因Case的执行顺序是从上往下遇到第一个匹配的Case就停下。无条件的Case如果排在前面它会无条件命中后面的条件Case根本没机会执行。解决检查“交互”面板里的Case顺序。右键Case可以上下移动把带条件的Case移动到顶部无条件分支放最后。养成习惯所有条件Case先建默认兜底Case最后建。5.4 在中继器外部引用Item属性显示为空现象详情页文本标签写[[Item.产品编号]]预览时为空或者在中继器之外的按钮上引用[[Item.姓名]]没有任何效果。原因Item是中继器行元件的上下文对象只有在中继器行内的元件事件里才可访问。中继器外部的页面和元件没有“当前行”的概念。解决需要把某行数据带出中继器时先在行内按钮事件里把[[Item.列名]]赋值给全局变量再执行跳转或打开弹窗。外部页面统一读全局变量。5.5 局部变量创建之后找不到现象在一个按钮的“设置文本”fx编辑器里添加了局部变量temp换到另一个按钮的事件里找不到temp重新输入也不生效。原因局部变量不是项目级的它只存在于那一个交互动作的表达式配置里。用“局部变量”这三个字去搜索全局变量面板自然找不到。解决局部变量的值需要被多个动作复用时第一时间考虑提升为全局变量。如果只是同一个动作里多处引用那就保留局部变量并且多个表达式分别添加同名的局部变量各取各的。6. 进阶技巧用变量字典把原型做成可维护的小数据接口原型里的变量一多最大的问题不是用错而是忘了哪个变量存的是什么。很久之后回来改原型打开全局变量表一排a、b、tmp没人知道哪个是登录态、哪个是缓存值。我的做法是给变量体系做一套约定再加一份可视化的“变量字典”。变量命名按前缀分组。界面输入类用form_开头比如form_userName临时计算类用cache_开头比如cache_totalPrice流程配置类用cfg_开头比如cfg_loginSuccessUrl界面状态类用ui_开头比如ui_panelState。这样一眼就能看出来一个变量是干什么用的也不会和元件名称混淆。同时在原型里专门建一个页面叫“变量字典”不参与演示只在编辑时打开。用表格把变量名列出来每个变量带一行注释用途、取值来源、在哪些页面被使用。改变量名之前先全局搜索旧名称的所有引用再改字典最后改交互配置。这个习惯能省掉很多“改完一个名字三个页面静悄悄失效”的问题。调试时也有一个实用技巧在页面角落放一个调试面板用若干文本标签把所有关键变量拼接显示出来表达式大致写成[[cacheName]] / [[cachePrice]] / [[ui_status]]。预览时盯着这行文本就能看到每个交互动作之后变量到底变成了什么值。判断逻辑不对先看变量值对不对能省掉大量的盲目右键检查。最后说一个我自己的教训。有一次做某跨平台系统的演示原型把form_userName改名成userName全局搜索漏了一个跳转页面里的引用评审演示时正好走到那条链路数据没带过去场面一度很尴尬。从那之后我立了规矩变量名改动必须同步更新变量字典和全部引用宁可多花十分钟检查也绝不留一个改一半的名字在原型里。希望帮到你。本文还有配套的精品资源点击获取

读完文章,也想定制专属网站?

尧图设计师 24 小时内与您沟通定制方案

免费获取报价 →
↑