Axure9.0中继器-初识篇

前言

很多刚入门Axure的产品小伙伴,做原型一直停留在静态页面阶段:做列表只能一个个复制元件,修改数据需要逐个改文本,想要做搜索筛选、新增删除、分页表格完全无从下手。

其实解决以上所有痛点,只需要吃透Axure9.0中**中继器(Repeater)**这一个核心元件。

中继器是Axure的灵魂功能,相当于原型里的小型数据库,不用写一行代码,就能轻松实现动态数据列表、后台管理表格、商品卡片、消息列表、搜索筛选、数据分页等高频交互效果。

一、什么是Axure中继器?

1.1 官方定义

中继器是Axure内置的数据驱动型重复元件,由【数据集+页面模板+交互事件】三部分组成,用一套页面模板,循环渲染多条数据,实现页面内容自动刷新、动态变化。

1.2 通俗理解

把中继器理解成一个Excel表格:

  • 数据集 = Excel单元格,存放所有原始数据(姓名、手机号、状态、时间等)
  • 内部模板 = 表格一行的样式,你只需要画好一行列表样式
  • 自动渲染 = 中继器自动根据数据集里的数据,可以批量复制数据也可以单独增加,数据变了,页面自动跟着变

1.3 什么时候必须用中继器?

只要页面存在重复元素+数据动态变化,一律优先使用中继器:

  • 后台管理系统:用户表格、订单列表、权限列表(筛选、删除、编辑、分页)
  • 移动端页面:消息列表、商品列表、收货地址列表
  • 常见交互:关键词搜索、下拉筛选、批量删除、新增表单数据

二、Axure9.0中继器三大核心结构

拖拽一个中继器到画布后,我们只需要掌握三大面板,就能完全掌控中继器,90%的新手看不懂中继器,就是分不清这三个模块。

2.1 数据集(Data)------数据源仓库

相当于数据库表单,支持新增列、删除列、批量录入数据,支持直接复制Excel表格一键粘贴导入,大幅提升填数据效率。

列名规范建议:统一英文命名,不要用中文,避免后续绑定数据报错,例如:name、phone、status、time

2.2 内部项(Item)------页面展示模板

双击中继器即可进入内部编辑页面,这里只需要绘制单行/单个卡片样式,不需要做多行。

所有重复的列表行、商品卡片,都是中继器自动复制这个模板生成的,模板改一行,全局所有列表样式同步修改。

2.3 交互面板(Interactions)------数据绑定与动态操作

核心两个必备事件:

  1. 每项加载时 :最常用!把数据集里面的数据,绑定到页面文本元件上,语法:\[Item.列名]
  1. 中继器专用动作:添加行、删除行、更新行、筛选、排序、分页
相关推荐
xy34538 小时前
Axure 9.0 列表框 介绍
ui·axure·原型·产品设计
xy34538 小时前
Axure 9.0 内联框架加载方式
前端·ui·html·axure·原型·产品设计
我是李工啊1 天前
PRD 总和代码对不上?让 AI 从代码生成状态图和权限矩阵
人工智能·产品经理
axe_hu1 天前
AI产品经理入门指南
人工智能·产品经理
huali2 天前
草稿该存在哪:per-session 是怎么成为共识的
前端·产品经理·产品
鸿蒙开发2 天前
# 代码写完才发现不能上线:微信小程序开发前必须准备的 8 件事
微信小程序·产品经理
Autumn_ing3 天前
AI原型设计工具怎么选?可编辑原型与可运行前端适合什么场景
前端·小程序·产品经理·代码·codex·墨刀ai客户端·ai原型
YuanDaima20483 天前
系统架构与数据库理论基础:PostgreSQL 与 pgvector
数据库·人工智能·docker·postgresql·系统架构·产品经理
axe_hu3 天前
从传统PM到AI产品经理的系统化转型路线图
人工智能·产品经理
axe_hu3 天前
AI产品经理需要具备哪些能力?
人工智能·产品经理