当数据量过多时,使用分页的形式分隔长列表。
import "../../components/lanyun-pagination/lanyun-pagination.stml";
<lanyun-pagination
@change="handleChange"
:border="true"
:current="current"
:total="240"
:per-page="6"
:page-size="3"
ellipses
border-color="#e5e7eb"
active-color="#EF4444"
inactive-color="#6B7280"
/>
参数 | 说明 | 类型 | 默认值 |
---|---|---|---|
current | 当前页数, 选填 | number | string | 1 |
total | 总条数, 必填 | number | string | - |
per-page | 每页展示条数, 必填 | number | string | - |
page-size | 显示页码的个数, 选填 | number | string | 3 |
ellipses | 是否显示省略号, 选填 | boolean | false |
border | 是否显示边框, 选填 | boolean | true |
border-color | 边框颜色, 选填 | string | #e5e7eb |
active-color | 当前页码颜色, 选填 | string | #06f |
inactive-color | 未激活页码颜色, 选填 | string | #111827 |
事件名 | 说明 | 回调参数 |
---|---|---|
change | 当页数发生改变时触发 | page : 改变后的页数 |
current
:参数需要传入变量之后,在change
事件中修改current
值才能显示正确的页数