Element UI paginationの現在ページを強制的に変更させたい

Element UI Pagination
https://element.eleme.io/#/en-US/component/pagination

やりたいこと

el-paginationの現在ページ（画面上でfocusされているページ番号）を明示的に指定したい。

ハマったポイント

現在ページを指定しているはずのcurrent-page.syncの変数を変更しても見た目上はページ移動しているように見えてしまう。

例えば、常に1ページ目を表示させたいのに、2とか3とかクリックするとそのページ番号がfocusされてしまいます。

原因

current-pageを変更しても次のDOM書き換えが起こるまで反映されない。

解決策

直接DOMで保持している変数を変更してやる。

$refsでel-paginationを指定して見るとinternalCurrentChangeというプロパティが存在し、これが画面上でfocusされているページ番号のようです。

<el-pagination
  ref="pagination"
  small
  layout="prev, pager, next"
  :total="50"
  :current-page.sync="currentPage">
</el-pagination>

var Main = {
  data () {
    return {
      currentPage: 1,
      internalPage: null
    }
  },
  mounted () {
    this.internalPage = this.$refs.pagination
  },
  watch: {
    currentPage () {
      /* ここでinternalCurrentPageを変更するとcurrent-pageも見た目も変更される */
      this.internalPage.internalCurrentPage = this.currentPage
    }
  }
}
var Ctor = Vue.extend(Main)
new Ctor().$mount('#app')

Demo
current-pageが常に1ページの時にinternalCurrentPage変更しない場合とする場合の動きを載せてあります。
https://jsfiddle.net/hsna/fwbmz1vm/