Pagination component is built based on Bootstrap 4 pagination template. You can enable or disable pagination and pagination info details based on your choice.
After applying the above custom template to previous and next button, pagination component will look like this.
Pagination info
SlotExample.vue
...<vue-bootstrap4-table :rows="rows" :columns="columns" :config="config"> <template slot="pagination-info"slot-scope="props"> This page total is {{props.currentPageRowsLength}} | Filterd results total is {{props.filteredRowsLength}} | Original data total is {{props.originalRowsLength}} </template></vue-bootstrap4-table>...
After applying the above custom template to pagination info , pagination info component will look like this.
props
From slot-scope="props" you can access the following attributes.
Selected rows info
SlotExample.vue
...<vue-bootstrap4-table :rows="rows" :columns="columns" :config="config"> <template slot="selected-rows-info"slot-scope="props"> Total Number of rows selected : {{props.selectedItemsCount}} </template></vue-bootstrap4-table>...
props
From slot-scope="props" you can access the following attributes.