<template lang="html">
<div class="wrap">
  <v-pager
    :total-pages="10"
    :visiable-pages="4"
    :page-click="pageClick"
    :current-page="4"
    :theme="'default'">
  </v-pager>
  <br>
  <br>
  <br>
  <v-pager
    :total-pages="10"
    :visiable-pages="4"
    :page-click="pageClick"
    :current-page="4"
    :theme="'mini'"
    :show-tools="true"
    :show-other-info="true"
    :previous-label="'«'"
    :next-label="'»'">
  </v-pager>
</div>
</template>
<style lang="css">
  .wrap {
    margin: 300px auto;
    width: 400px;
  }
</style>
<script>
import VPager from '../dist/v-pager';

export default {
  components: {
    VPager
  },
  data() {
    return {
      pagination: {
        currentPage: 1
      }
    };
  },
  methods: {
    pageClick(clear) {
      let self = this;
      setTimeout(() => {
        clear();
      }, 0);
    }
  }
};
</script>

<style lang="less">
body {
  background: #efefef;
}
</style>
