JarCasting
JarCasting JarCasting

vue-pagination-bootstrap

WebJar for vue-pagination-bootstrap

License

License

ISC
GroupId

GroupId

org.webjars.npm
ArtifactId

ArtifactId

vue-pagination-bootstrap
Last Version

Last Version

1.0.3
Release Date

Release Date
Type

Type

jar
Description

Description

vue-pagination-bootstrap
WebJar for vue-pagination-bootstrap
Project URL

Project URL

http://webjars.org
Source Code Management

Source Code Management

https://github.com/brunoseco/vue-pagination-bootstrap

Download vue-pagination-bootstrap

Filename Size
vue-pagination-bootstrap-1.0.3.pom
vue-pagination-bootstrap-1.0.3.jar 5 KB
vue-pagination-bootstrap-1.0.3-sources.jar 22 bytes
vue-pagination-bootstrap-1.0.3-javadoc.jar 22 bytes
Browse

How to add to project

<!-- https://jarcasting.com/artifacts/org.webjars.npm/vue-pagination-bootstrap/ -->
<dependency>
    <groupId>org.webjars.npm</groupId>
    <artifactId>vue-pagination-bootstrap</artifactId>
    <version>1.0.3</version>
</dependency>
// https://jarcasting.com/artifacts/org.webjars.npm/vue-pagination-bootstrap/
implementation 'org.webjars.npm:vue-pagination-bootstrap:1.0.3'
// https://jarcasting.com/artifacts/org.webjars.npm/vue-pagination-bootstrap/
implementation ("org.webjars.npm:vue-pagination-bootstrap:1.0.3")
'org.webjars.npm:vue-pagination-bootstrap:jar:1.0.3'
<dependency org="org.webjars.npm" name="vue-pagination-bootstrap" rev="1.0.3">
  <artifact name="vue-pagination-bootstrap" type="jar" />
</dependency>
@Grapes(
@Grab(group='org.webjars.npm', module='vue-pagination-bootstrap', version='1.0.3')
)
libraryDependencies += "org.webjars.npm" % "vue-pagination-bootstrap" % "1.0.3"
[org.webjars.npm/vue-pagination-bootstrap "1.0.3"]

Dependencies

There are no dependencies for this project. It is a standalone project that does not depend on any other jars.

Project Modules

There are no modules declared in this project.

vue-pagination-bootstrap

Server-side paging component in vue, template based on bootstrap

Installation

$ npm install vue-pagination-bootstrap

Example

import pagination from 'vue-pagination-bootstrap'
    
new Vue({
  el: '#app',,
  components: { pagination }
  data () {
    return {
      total: 1000,
      pageSize: 50,
      paginationOptions: { // Not required to pass this configurations
		    offset: 2,
        previousText: 'Prev',
        nextText: 'Next',
        alwaysShowPrevNext: true
      }
    }
  },
  methods: {
    pageChanged (page) {            
      console.log(page)
      // Exec your response to server passing 'page' params as clicked button paging
    }
  }
})
<body id="app">
  <pagination :total="total" :page-size="pageSize" :callback="pageChanged" :options="paginationOptions" nav-class="padding-10" ul-class="bg-color-red" li-class="txt-color-blue">
  </pagination>
</body>

Props

Name Type Default Required Description
total Number true Total itens in server side
pageSize Number true Number of itens in page
callback Function true Callback function used to load data for selected page
nav-class String false Class will be include in nav element
ul-class String false Class will be include in ul element
li-class String false Class will be include in all li element
Options
Name String Default Description
offset Number 3 Left and right offset of pagination numbers to display
ariaPrevious String Previous Change default aria previous text
ariaNext String Next Change default aria next text
previousText String « Change default previous button text
nextText String » Change default next button text
alwaysShowPrevNext Boolean false Show prev/next button even if on first/last page

Versions

Version
1.0.3