Axure9中继器多数据实现分页

首先准备21条数据,确保分页效果显示明显。

勾选多页显示选项,实现一页表格中十条数据的效果。

分页设置

跳转至尾页

新建交互 > 设置当前显示页面

由于表格数据是不断增加的,并不清楚尾页的页码,那么此时直接选择尾页就可以解决。

跳转至首页

首页页码是清晰的,此时直接明确页码值即可。

跳转至上一页

直接在交互中设置上一项

设置跳转至下一项同理。

页码设置

下一页页码变化

原型的页码显示在中继器外,所以在新建交互之时需要设置局部变量连接到中继器。

上一页页码变化

首先,将下一页设置的页码交互复制到页码文本的载入时交互中。

所有分页设置按钮都新增一个交互"触发事件",让页码在变化的时候还能够依据情况更新。

此时,先前设置的下一页的页码变化的交互事件"设置文本"就可以不需要了。

总页码数动态更新

代表页面总页数的值可以设置动态的数值。

页码最开始的文本可以用null/null代替。

分页效果整体预览

相关推荐
端庄的战斗机5 小时前
javascript 设计模式(文章很长,请自备瓜子,水果和眼药水)
开发语言·javascript·设计模式
饼干哥哥11 小时前
我开发了一个「吃掉」别人Skill来升级的饕餮.Skill,现在免费开源
人工智能·设计模式·开源
CaffeinePro12 小时前
什么是系统架构?架构师到底在做什么?
设计模式·架构
AI人工智能+电脑小能手14 小时前
【大白话说Java面试题 第156题】【06_Spring篇】第16题:Spring 用到了哪些设计模式?
java·spring·设计模式·代理模式·工厂模式
前端百草阁16 小时前
JavaScript 设计模式(23 种)
开发语言·前端·javascript·设计模式
geovindu16 小时前
java: Singleton Pattern
java·开发语言·后端·单例模式·设计模式·创建型模式
geovindu1 天前
python: Functional Options Pattern
开发语言·后端·python·设计模式·惯用法模式·函数式选项模式
Kel1 天前
Pregel 为什么会成为LangGraph编排的心脏
人工智能·设计模式·架构
会周易的程序员2 天前
microLog 后端开发指南
开发语言·c++·物联网·设计模式·日志·iot·aiot
geovindu2 天前
go: Functional Options Pattern
开发语言·后端·设计模式·golang·函数式选项模式’·惯用法模式