Documentation
Documentation Hub

Rounded:none

The pagination component can have different radius factors. Use the rounded prop to change the radius of the pagination.

Default props of all <BasePagination> can be set in your .app/app.config.ts.
Show code

Rounded:sm

The pagination component can have different radius factors. Use the rounded prop to change the radius of the pagination. Here is an example of a rounded:sm pagination.

Show code

Rounded:md

The pagination component can have different radius factors. Use the rounded prop to change the radius of the pagination. Here is an example of a rounded:md pagination.

Show code

Rounded:lg

The pagination component can have different radius factors. Use the rounded prop to change the radius of the pagination. Here is an example of a rounded:lg pagination.

Show code

Rounded:full

The pagination component can have different radius factors. Use the rounded prop to change the radius of the pagination. Here is an example of a rounded:full pagination.

Show code

#<BasePagination>

Properties

item-per-page
The number of items to display per page.
Required
Show example
total-items
The total number of items.
Required
Show example
rounded
The radius of the pagination.

@since

2.0.0

@default

'sm'

Show example
current-page
The current page number.
Show example
max-links-displayed
The maximum number of links to display.
Show example
router-query-key
The query key to use for routing.
Show example
previous-icon
The icon to show for the previous button.
Show example
next-icon
The icon to show for the next button.
Show example
ellipsis
The ellipsis to show when there are too many links.
Show example
no-router
Whether to disable routing.
Show example

Events

@update:currentPage
Show example

Slots

#before-pagination
Show example
#after-pagination
Show example
#before-navigation
Show example
#previous-icon
Show example
#next-icon
Show example
#after-navigation
Show example