你是不是也曾在用axure做后台管理系统时，被动态表格搞得头大？😩 数据绑定老是出错、分页功能调不通、筛选排序总失灵……明明想做个高保真原型，结果光折腾中继器就花了大半天！别慌，云哥今天就用零基础保姆级教程带你搞定中继器动态表格，从此告别静态截图，做出让开发都惊叹的交互效果！🚀
一、中继器到底是什么？为什么它才是动态表格的灵魂？
中继器（Repeater）本质是axure里的轻量级数据库🗃️，能存储结构化数据并动态渲染到界面上。它由三部分组成：数据集（存放数据）、样式模板（定义显示样式）、交互动作（控制数据操作）。传统静态表格需要手动复制排版，而中继器只需绑定一次数据，即可自动生成重复项，支持批量修改、实时筛选、排序分页——这才是高效原型的核心！
二、动态表格制作全流程（附数据绑定详解）
- 1.
搭建表格框架：拖入中继器元件→双击进入编辑页→用矩形和文本组件绘制表头和数据行（例如：姓名列、年龄列、操作列）
- 2.
配置数据集：
- •
选中中继器，在属性面板点击”数据集”→添加列（如Name、Age、ID）
- •
填入示例数据（支持直接从Excel粘贴！）
- •
- 3.
关键一步：数据绑定！
- •
双击中继器的”每项加载时”事件→添加”设置文本”动作
- •
选择表格中的文本组件，在值中输入
[[Item.Name]]（Name需与数据集列名一致） - •
重复操作绑定所有列，注意列名大小写必须完全匹配❗
- •
- 4.
预览基础效果：此时表格应自动渲染出所有数据行，如果显示空白，检查绑定字段名是否拼错！
三、让表格”活”起来：排序、筛选与分页设置
► 排序功能：
- •
给表头”年龄”按钮添加点击交互→添加”排序”动作→选中中继器→选择列名Age→设置升序/降序
- •
进阶技巧：用
[[Item.Age]]表示数字列，文本列用[[Item.Name]]，否则排序可能乱序
► 筛选搜索：
- •
添加搜索框→文本改变时触发”筛选”动作
- •
筛选规则输入：
[[Item.Name.indexOf(LVAR1)>=0]]（LVAR1为搜索框文本，实现模糊匹配）
► 分页控制：
- •
中继器样式面板→勾选”分页”→设置每页5行
- •
添加页码按钮→交互设置为”设置当前显示页”
四、高级玩法：增删改查与实战避坑指南
新增数据行：
- •
制作表单→提交按钮添加”新增行”动作→映射表单输入项到中继器列（例：文本框Name对应
[[Item.Name]]）删除数据行：
- •
每行添加删除按钮→交互设置”删除行”（需勾选”当前行”选项）
更新数据：
- •
双击行进入编辑→用”更新行”动作将输入框值同步回数据集
💡 云哥独家心得：
- •
中继器数据列严禁用中文命名，建议英文驼峰格式（如userName）避免函数报错
- •
复杂筛选多用
indexOf和toLowerCase组合（如[[Item.Name.toLowerCase().indexOf(LVAR1.toLowerCase())>=0]]）忽略大小写 - •
分页总数公式：
[[Math.ceil(ItemCount/5)]]（5为每页行数），可直接显示在页码栏
中继器表格最难的不是操作，而是数据思维——把界面当作数据库的视图，用动作驱动数据变化。多练两次你会发现，原来axure也能玩出后端逻辑感！✨