使用vxe表格,但是每次翻页序号都从1重新开始,想让序号第一页是1-20,第二页是21-40这样,该怎么做?
```html
<vxe-table-column
title="序号"
type="seq"
width="50"
align="center"
></vxe-table-column>
使用vxe表格,但是每次翻页序号都从1重新开始,想让序号第一页是1-20,第二页是21-40这样,该怎么做?
```html
<vxe-table-column
title="序号"
type="seq"
width="50"
align="center"
></vxe-table-column>
你可以通过 table-index 属性和一个计算属性来实现这个需求。首先,给 vxe-table-column 组件添加 table-index 属性,如下所示:
<vxe-table-column type="index" width="80" :table-index="tableIndex"></vxe-table-column>
然后,在你的 data 中添加一个变量,名为 currentPage,表示当前页数:
data() {
return {
currentPage: 1,
// ...
}
}
接着,在 computed 中添加一个计算属性,用于计算当前页的起始序号:
computed: {
tableIndex() {
return (this.currentPage - 1) * 20 + 1
},
// ...
}
最后,在你的分页组件中,监听 current-change 事件,并将当前页数赋值给 currentPage 变量:
<vxe-pagination @current-change="currentPage = $event"></vxe-pagination>
这样,就可以实现你想要的效果了。
补充
翻页序号连续性可以试一下
添加属性
:seq-config="{startIndex: (tablePage.currentPage - 1) * tablePage.pageSize}"
大概是这样的实现逻辑,希望能帮到你