vue-pagination
vue-pagination copied to clipboard
vue-pagination not working
Hello guys,
i am trying to use this plugin to add pagination to my table.
vue --version : 2.9.6
here is the html code :
<div class="row"> <div class="col-xs-12 col-md-12"> <vuestic-widget :headerText="$t('tables.basic')"> <div class="table-responsive"> <table class="table table-striped first-td-padding" v-for="itemb in items"> <thead> <tr> <td>N</td> <td>H</td> <td>T</td> <td></td> </tr> </thead> <tbody> <tr> <td>{{itemb.n}}</td> <td>{{itemb.h}}</td> <td>{{itemb.t }}</td> <td></td> </tr> </tbody> </table> <pagination :pagination="pagination" :callback="loadData" :options="paginationOptions"></pagination> </div> </vuestic-widget> </div> </div>
and here is the loadData method that is supposed to be called : methods :{ loadData() { const options = { params: { paginate: this.pagination.per_page, page: this.pagination.current_page, /* additional parameters */ } }; axios.get('/allBlocks', options) .then(result => { console.log("all blooocks", result.data) this.items = result.data; this.pagination.current_page = 1 this.pagination.last_page = 5 }, error => { console.error(error); }); } },
i don't understand why is it not working , i have followed the instructions stated, but still ... even the log does not show .. it is like the loadData method is not even called.
Thank you,
Greetings,
Have you tried moving the pagination component outside the vuestic-widget, maybe that interferes with it or overlaps it somehow?
What does the console say? Is the pagination component installed correctly? Does it display correctly? Any errors when you try to change pages?