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. 中继器专用动作:添加行、删除行、更新行、筛选、排序、分页
相关推荐
领麦微红外1 天前
SMD封装:MLX90632国产替代MEMS红外测温传感器融入智能穿戴的结构考量
产品经理·智能硬件
北京晶数信息科技1 天前
加油站成品油智慧监管平台+交易即开票一体化解决方案 (三)
大数据·人工智能·物联网·产品经理·需求分析
游戏新手村2 天前
蝴蝶图在餐饮门店数据可视化中的应用
大数据·信息可视化·产品经理·数据可视化
PM老周2 天前
PRD怎么用AI质检?需求预审、人工复核与整改闭环
人工智能·项目管理·产品经理·prd
领麦微红外2 天前
MLX90614国产替代:1对1 技术支持与算法定制重构MEMS红外测温传感器服务模式
产品经理·智能硬件
zzzzzz3102 天前
当客户说「用AI帮我写个和Notion一模一样的,预算5000,三天上线」时,我在想什么
人工智能·程序员·产品经理
领麦微红外4 天前
紧凑型设备中的红外测温方案: S-D1贴片传感器在IoT产品中的应用分析
物联网·产品经理·智能硬件
腻害兔4 天前
【若依项目-产品经理视角】RuoYi-Vue-Pro 源码拆解:IM 即时通讯模块,一个被低估的「全功能聊天系统」
java·前端·vue.js·产品经理·ai编程
北京晶数信息科技4 天前
加油站成品油智慧监管平台+交易即开票一体化解决方案 (一)
大数据·人工智能·物联网·产品经理·需求分析
产品人卫朋4 天前
从AGI阶梯看AI硬件:具身智能还很远,物理约束就在眼前
人工智能·机器人·产品经理·创业·ai硬件