vue-3-tailwind-css-pagination
Vue 3 Tailwind Css Pagination
A Vue 3 Tailwind Css component for pagination.
Demo

Installation
// with npm
npm i vue-3-tailwind-css-pagination
Getting Started
Import component
import {createApp} from 'vue'
import {Vue3TailwindPagination} from "vue-3-tailwind-css-pagination";
const app = createApp(App)
app.component('Vue3TailwindPagination', Vue3TailwindPagination)
app.mount('#app')
How to use
<vue3-tailwind-pagination
:total="79"
:per_page="5"
:active_color="'text-white'"
:active_background="'bg-red-500'"
:current_page="pagination.page"
@change="change"/>
Props and attributes
| Id | type | Default | Description |
|---|---|---|---|
| total | Number | 79 | Total number of pages |
| current_page | Number | 1 | Current page |
| per_page | Number | 5 | Items per page |
| background | String | bg-gray-200 | - |
| active_background | String | bg-gray-900 | - |
| color | String | text-gray-500 | - |
| active_color | String | text-white | - |
| border_color | String | border-transparent | - |
| active_border_color | String | border-transparent | - |
Events
| Id | Output | Description |
|---|---|---|
| change | Number | The current page has been updated |
Version History
| Version | Released | Vue | License |
|---|---|---|---|
| 2.1.1 | ^3.2.37 | ||
| 2.1.0 | ^3.2.37 | ||
| 2.0.4 | ^3.0.0 | MIT | |
| 2.0.3 | ^3.0.0 | MIT | |
| 2.0.2 | ^3.0.0 | MIT | |
| 2.0.1 | ^3.2.37 | ||
| 0.1.5 | ^3.2.37 | ||
| 0.1.4 | ^3.2.37 | ||
| 0.1.3 | ^3.2.37 | ||
| 0.1.2 | ^3.2.37 | ||
| 0.1.1 | ^3.2.37 | ||
| 0.1.0 | ^3.2.37 | ||
| 0.0.9 | ^3.2.37 | ||
| 0.0.8 | ^3.2.37 | ||
| 0.0.7 | ^3.2.37 | ||
| 0.0.6 | ^3.2.37 | ||
| 0.0.5 | ^3.2.37 | ||
| 0.0.4 | ^3.2.37 | ||
| 0.0.3 | ^3.2.37 | ||
| 0.0.2 | ^3.2.37 | ||
| 0.0.1 | ^3.2.37 |