Pagination

2022-07-29 06:32

Pagination.

Sample Code

copy

    {
      "defaultTitle": "Mini Program AntUI component library",
      "usingComponents": {
        "pagination": "mini-antui/es/pagination/index"
      }
    }

copy

    <view>
      <view class="demo-title">Basic usage</view>
      <pagination total="{{20}}" current="{{1}}"/>
      <view class="demo-title">Arrow button</view>
      <pagination mode="icon" total="{{20}}" current="{{10}}"/>
      <view class="demo-title">Simple mode</view>
      <pagination simple total="{{20}}" current="{{1}}"/>
      <view class="demo-title">Button disabled</view>
      <pagination total="{{20}}" current="{{1}}" disabled/>
      <view class="demo-title">Custom button text</view>
      <pagination arrow prevText="Previous" nextText="Next" total="{{20}}" current="{{1}}"/>
    </view>

copy

    Page({})

Attributes

Attribute Name	Description	Type	Default
mode	Button form options: text, icon	String	text
total	Total number of pages	Number	0
current	Current page number	Number	0
simple	Hide value or not	Boolean	false
disabled	Disabled status	Boolean	false
prevText	Text for page-up button	String	Previous page
nextText	Text for page-down button	String	Next page
btnClass	Pagination button style, for text type buttons only	String	-
onChange	Pagination callback function	(index: Number) => void	-

Note: prevText and nextText take effect only when mode is text.