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
vue

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
vue

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
vue

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
vue

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
vue

#<BasePagination>

•Properties

item-per-page
The number of items to display per page.
Required
Show example
vue
total-items
The total number of items.
Required
Show example
vue
classes
Optional CSS classes to apply to the component inner elements.
Show example
vue
current-page
The current page number.
Show example
vue
ellipsis
The ellipsis to show when there are too many links.
Show example
vue
max-links-displayed
The maximum number of links to display.
Show example
vue
next-icon
The icon to show for the next button.
Show example
vue
no-router
Whether to disable routing.
Show example
vue
previous-icon
The icon to show for the previous button.
Show example
vue
router-query-key
The query key to use for routing.
Show example
vue

•Properties (with app.config)

color
The color of the pagination active button.

@since

3.0.0

Show example
vue
rounded
The radius of the pagination.

@since

2.0.0

Show example
vue

•Events

@update:currentPage
Show example
vue

•Slots

#before-pagination
This slot has no inherted props
Show example
vue
#after-pagination
This slot has no inherted props
Show example
vue
#before-navigation
This slot has no inherted props
Show example
vue
#previous-icon
This slot has no inherted props
Show example
vue
#next-icon
This slot has no inherted props
Show example
vue
#after-navigation
This slot has no inherted props
Show example
vue

•Exposed

color
The color of the pagination active button.
Show example
vue
rounded
The radius of the pagination.
Show example
vue