分页器将一类元素进行分页显示
image.pngimage.png
image.pngimage.png
image.png
image.png

使用

  1. import { PageNavigator } from '@antv/gui';

配置项

viewDisplayObject 待分页的对象
widthnumber 画布宽度 （若不指定，则自动进行测算）
heightnumber 画布高度
pageWidthnumber页宽
pageHeightnumber页高
effectEasing 分页动画效果
durationnumber 翻页耗时
orient’vertical’ | ‘horizontal’ 默认分页方向
initPageNumnumber 初始化页码
pageLimitnumber 总页数，默认根据画布宽高和方向自动推断，指定回调方法时，需要手动配置总页数
loopboolean 循环翻页
pageCallback (pageNum: number)=>{x: number, y: number} 自定义页位置回调方法
button
prevButtonCfg 前翻页按钮
nextButtonCfg 后翻页按钮
spacingnumber 翻页按钮到内容的距离
position’top’ | ‘bottom’ | ‘left’ | ‘right’ | ‘horizontal’ | ‘vertical’ 按钮位置
paginationfalse | 页码
type标签 页码样式类型，< 1/5 > < 1 2 3 4 5 >
styleMixAttrs<TagCfg> 页码状态样式
separatorstring/ 分隔符 1/5 样式页码下生效
spacingnumber 页码到内容的距离
position’top’ | ‘bottom’ | ‘left’ | ‘right’ 页码位置，如果与按钮位置相同，则会调整布局

API

goTo(to, from):Promise(page) 从指定页（默认为当前页）跳转到目标页
prev():Promise(page) 向前翻页Ï
next():Promise(page) 向后翻页