I recently incorporated a Bootstrap Vue Table into my application and wanted to monitor user activity as they navigate through the pages using the pagination feature.
Here is where you can find more information on the Bootstrap Vue Table
To achieve this, I included a @change event listener that is intended to capture and log the current page number (currentPage) of the pagination. However, it appears that the event is triggered before the currentPage value is actually updated.
What would be the correct approach to accurately track this update?
This is what I have attempted so far: Click here to see my code snippet on JSFiddle
new Vue({
el: "#app",
data: {
totalRows: 50,
perPage: 10,
currentPage: 1
},
methods: {
pagination() {
console.log(this.currentPage);
},
}
})<div id="app">
<div>
<b-pagination :total-rows="totalRows" :per-page="perPage" v-model="currentPage" @change="pagination" />
</div>
</div>