Vuejs-pagination-semantic-ui NPM

Vue Pagination for Semantic-UI :zap:

This is on GitHub so let me know if I've messed it somewhere, give me a star :star: if you like it, :beers:
Server-side paging component in vue, template based on Semantic-UI.

Vue.js (2.x)
Semantic-UI CSS (2.x.x)

:white_check_mark: Installation :ok_hand:

$ npm install vuejs-pagination-semantic-ui

:white_check_mark: Usage :mortar_board:

import pagination from 'vuejs-pagination-semantic-ui'
    
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
    }
  }
})

:white_check_mark: Example :four_leaf_clover:

<body id="app">
  <pagination :total="total" :page-size="pageSize" :callback="pageChanged" :options="paginationOptions">
  </pagination>
</body>

:white_check_mark: :book: Props:

Name	Type	Required	Description
total	Number	true	Total items in server side
pageSize	Number	true	Number of items in page
callback	Function	true	Callback function used to load data for selected page

:white_check_mark: :book: Options:

Name	String	Default	Description
offset	Number	3	Left and right offset of pagination numbers to display
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

NPM :octocat:

License :book:

vue2 vuejs semantic-ui pagination paginate vuejs-pagination vuejs2

@infinitebrahmanuniverse/nolb-vuej @everything-registry/sub-chunk-3102

1.0.0

7 years ago