Vue.js - Смотреть изменения данных

Question

Я добавил Bootstrap Vue Table в свое приложение и хотел войти, когда пользователь переключается на другую страницу, используя встроенную нумерацию страниц.

https://bootstrap -vue.js.org / docs / components / table /

Для этого я добавил @change, который должен прослушивать и регистрироватьv-модель нумерации страниц, currentPage.Тем не менее, кажется, что он вызывается до фактического обновления currentPage.

Как правильно прослушать это обновление?

Вот что я пробовал: https://jsfiddle.net/eywraw8t/394424/

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>

Answer 1

Вы можете посмотреть currentPage

new Vue({
  el: "#app",
  data: {
   totalRows: 50,
   perPage: 10,
   currentPage: 1
  },
  watch: {
    currentPage: function (newVal) {
       console.log('Change to page', newVal)
    }
  },
  methods: {
    setTo() {
     this.currentPage = 1;
     console.log(this.currentPage);
    }
  }
})

Проверьте демо здесь