Pagination API

Pagination extension.

const { ...ReturnValues } = usePagination<R, P>(Service, Options);

See also: Pagination

Note

The following APIs are a superset of the Public API. Unless otherwise specified, they are consistent with the Public API.

Return Values

current

• Type: Ref<number>

• Default: 1

  The current page number. We internally listen to this value, so when you directly modify current, the changeCurrent method will be triggered automatically. Therefore, you can use it together with v-model.

pageSize

• Type: Ref<number>

• Default: 10

  The number of items per page. We internally listen to this value, so when you directly modify pageSize, the changePageSize method will be triggered automatically. Therefore, you can use it together with v-model.

total

• Type: Ref<number>

• Default: 0

  The total number of data.

totalPage

• Type: Ref<number>

• Default: 0

  The total number of pages, which may be incorrect if the total and pageSize are not set correctly.

changeCurrent

• Type: (current: number) => void

  Change the current page number.

changePageSize

• Type: (pageSize: number) => void

  Change the number of items per page.

changePagination

• Type: (current: number, pageSize: number) => void

  Change both the page number and the number of items per page.

Options

pagination

• Type:

  {
    currentKey?: string;
    pageSizeKey?: string;
    totalKey?: string;
    totalPageKey?: string;
  }
  

• Details:

Tips

totalKey and totalPageKey are implemented using lodash.get, so you can pass in a path to an object property to retrieve the value. For more details, please refer to the lodash documentationopen in new window.

pagination Field	Description	Defaults
currentKey	You can use this value to specify the property name of the current page number parameter in the API. parameter.	'current'
pageSizeKey	You can use this value to specify the property name of the number of items per page parameter in the API.	'pageSize'
totalKey	Specify the path of the total property in the data object.	'total'
totalPageKey	Specify the path of the totalPage property in the data object.	'totalPage'