<template>

  <div class="index">

    <el-pagination

      background

      :hide-on-single-page="true"

      layout="total, prev, pager, next"

      :current-page="currentPage"

      :page-size="pageSize"

      @current-change="handleCurrentChange"

      :total="total">

    </el-pagination>

  </div>

</template>

<script>

export default {

  name: 'HelloWorld',

  data () {

    return {

      total: 126,

      currentPage: 1,

      pageSize: 3 // 每页显示的数量

    }

  },

  created: {

  },

  methods: {

    handleCurrentChange (currentPage) {

      // 显示当前页数对应的数据

      console.log('currentPage = ' + currentPage)

    }

  }

}

</script>

<style>

</style>