表格中序号递增

543 阅读1分钟

在表格中实现序号递增,翻页会接着上一页

image.png

image.png

<el-table :data="tableData" height="97%" style="margin:10px;" tooltip-effect="dark">
   <el-table-column type="index" prop="order" label="序号" width="100px" :index="getIndex">
   </el-table-column>
</el-table>

在序号这列中加入:index="getIndex"

data(){
    return{
      queryParams:{
        page_num:1,
        page_size:10,
      },
    }
},
methods:{
   getIndex(index){
      return index + (this.queryParams.page_num - 1)*this.queryParams.page_size + 1;
   },
}

题外话 解决文本超长问题

在表中<el-table>加入tooltip-effect="dark" ,然后在需要用的地方<el-table-column>加入show-overflow-tooltip