div部分
<el-table
:data="tableData.slice((currentPage-1)*pagesize,currentPage*pagesize)"
绑定数据确定关系
style="width:100%"
:default-sort = "{prop: 'date', order: 'descending'}"
>
<el-table-column
prop="date"
label="日期"
width="180">
</el-table-column>
<el-table-column
prop="name"
label="姓名"
width="180">
</el-table-column>
<el-table-column
prop="address"
label="地址">
</el-table-column>
</el-table>
分页
<el-pagination class="fy"
layout="prev, pager, next"
@current-change="current_change"
:total="total"
background
>
</el-pagination>
VUEJS部分
vue {
data{
total:1000,//默认数据总数
pagesize:9,//每页的数据条数
currentPage:1,//默认开始页面}
tableData: [{
date: '2016-05-02',
name: '王小虎',
address: '上海市普陀区金沙江路 1518 弄'
}, {
date: '2016-05-04',
name: '王小虎',
address: '上海市普陀区金沙江路 1517 弄'
}, {
date: '2016-05-01',
name: '王小虎',
address: '上海市普陀区金沙江路 1519 弄'
}, {
date: '2016-05-03',
name: '王小虎',
address: '上海市普陀区金沙江路 1516 弄'
}],
methods:{
created:function(){
this.total=this.tableData.length;
},
current_change:function(currentPage){
this.currentPage = currentPage;
},
}
}
