文档基于分页v1.0.14版本

组件说明

分页组件用于分割长列表，当加载数据需要切换页码浏览数据(如轮播表格一次性导入数千条数据时)，可应用分页组件进行页码切割展示，每次只加载一个页面。

效果案例

*分页 效果案例

一、样式

在样式中可以设置组件的基本属性、全局和样式。

1、基本属性

位置尺寸

位置包括组件的横坐标和纵坐标，单位为px；横坐标为组件左上角距离页面左边界的像素距离，纵坐标为组件左上角距离页面上边界的像素距离。

尺寸包括组件的宽度和高度，单位为px；可单击比例锁锁定组件宽高比，等比例调整组件的宽高，比例锁默认不锁定。

*尺寸调整不影响组件内容显示、组件动画。

*组件位置尺寸说明

默认隐藏

勾选之后在初始加载时组件默认隐藏且关闭回调触发，通常用来配合显隐控制，如【选项卡】组件进行显隐切换。

2、全局

在全局中支持配置组件首尾按钮、选项全局样式、省略号等样式。

首尾按钮

开启后可快速进行首尾页切换操作。

*首尾按钮说明

水平对齐

页码数字的对齐方式，可以设置为左对齐、居中对齐、右对齐。

两侧选项数

可以自定义设置多个页码隐藏、选择页码的两侧选项数。

圆角

可调整选项的圆角样式。

项间距

可调整页数选项之间的间距。

尺寸

支持调整选项的宽、高。

省略号

支持调整省略号的颜色样式

3、样式

默认、悬浮、选中

选项的样式设置，支持配置文本样式、背景、描边。

*默认、悬浮、选中样式说明

二、操作步骤

添加数据

添加一个数据容器组件，接入数据，发出回调参数，由分页组件接收这批数据。

*分页组件接收数据

判断页数

分页组件对接收的数据数量进行页数判断(需要提前确认轮播表格的单页展示数)，计算出总页数，并把页数的数据作为回调参数传输出去。

*分页传出分页页数数据

轮播表格接收单页数据

使用另一个数据容器，根据分页中的当前页字段判断每一页显示的数据，传出当前页数据，并由轮播表格进行接收展示，即可完成点击不同页切换数据效果。

*轮播表格接收并展示每页的数据

操作案例👉📎列表分页_691089.zip

三、数据

组件数据格式

*组件数据格式说明

JSON数据案例

[
	{
		"total": 100,
	}
]

数据配置项说明

数据对接详情

数据对接详情请见以下文档👇

项目交付——数据对接入门

四、交互

当前组件可通过载入动画、回调参数、自定义事件进行交互配置。

载入动画

所有组件均提供移入、移入(小)、划变三种组件载入动画。

载入动画选择无时，则组件没有载入动画。

载入动画仅在可视化应用预览、发布组件加载时显示。

回调参数

回调参数即为全局性的参数变量，用于控制组件之间参数的传递，可通过设置回调参数来实现数据驱动交互。

其中，字段值即参数变量，变量名即对字段值的重命名。

详细的回调参数教学👉 回调的使用

自定义事件

自定义事件支持通过数据驱动组件状态、或变更组件样式配置，也可自定义编辑复杂的条件逻辑。

详细的自定义事件教学👉自定义事件教学

实操demo

欢迎您在评论区留下您对该组件的意见，管理员会及时回复您，如长时间未回复欢迎您搜索钉钉群：33782396或者扫描以下二维码添加微信群 说出您的想法，采纳后将送出定制礼品。

也可以通过问卷来向我们反馈需求：https://jinshuju.net/f/XyCXU0