huqi92
<div id="app">
  <el-table :data="tableData.slice((currentPage-1)*pageSize,currentPage*pageSize)" style="width: 100%">
    <el-table-column v-for="item in tableHeader" :prop="item.key" :label="item.name" show-overflow-tooltip=true>
    </el-table-column>
  </el-table>
  <el-pagination @size-change="handleSizeChange" @current-change="handleCurrentChange" :current-page.sync="currentPage" :page-size="pageSize"     layout="total, prev, pager, next,jumper" :total="tableData.length">
  </el-pagination>
</div>
<script>
var app = new Vue({
  el: \'#app\',
  data: {
    tableHeader: [{
        name: \'日期\',
        key: \'date\'
      },
      {
        name: \'姓名\',
        key: \'name\'
      },
      {
        name: \'地址\',
        key: \'address\'
      }],
    tableData: [{
      date: \'2016-05-04\',
      name: \'王小虎2\',
      address: \'上海市普陀区金沙江路 1517 弄\'
    },{
      date: \'2016-05-03\',
      name: \'王小虎15\',
      address: \'上海市普陀区金沙江路 1516 弄\'
    }],
    pageSize: 5,
    currentPage: 1,
    },
    methods: {
      handleSizeChange: function() {},
      handleCurrentChange: function() {}
    }
})
</script>

分类:

技术点:

相关文章: