可以直接写在html里,上代码:
<el-table-column label="序号" type="index" width="60" header-align="center" align="center">
<template slot-scope="scope">
{{ scope.$index + (pageFilter.current - 1) * pageFilter.size + 1 }}
</template>
</el-table-column>
也可以通过方法去设置翻页序号累加:
<el-table-column type="index" label="序号" width="50" align="center" :index="computeTableIndex" />
computeTableIndex(index) {
return (this.pageFilter.current - 1) * this.pageFilter.size + index + 1
}
个人觉得直接在template里面写最简单
附上分页代码:
<el-pagination
:page-sizes="[10, 30, 50,100]"
:current-page.sync="pageFilter.current"
:page-size.sync="pageFilter.size"
:total="pageFilter.total"
layout="total, sizes, prev, pager, next, jumper"
prev-text="上一页"
next-text="下一页"
class="m-top-10"
@size-change="getSourceData"
@current-change="getSourceData"
/>
pageFilter: {
current: 1,
size: 10,
total: 0
},