vue+element-ui(el-table分页序号自增)

最新推荐文章于 2024-12-31 11:49:34 发布

smileNano

最新推荐文章于 2024-12-31 11:49:34 发布

阅读量1.2k

点赞数 4

CC 4.0 BY-SA版权

文章标签： vue.js javascript elementui

本文链接：https://blog.csdn.net/smileNano/article/details/135978622

本文介绍了如何在使用Vue和ElementUI构建的数据表格中实现动态序号生成，重点讲解了`indexMethod`函数，该函数根据当前页码和每页大小计算并返回自增的行号。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

<el-table :data="数据表" style="width: 100%">
   <el-table-column type="index" :index="indexMethod" label="序号" width="70" align="center">
   </el-table-column>
</el-table>

methods: {
    // 序号自增--方法
    indexMethod(index) {
      // 拿到页码
      const currentPage = this.queryParams.pageNum;
      // 拿到每页记录条数
      const pageSize = this.queryParams.pageSize;
      // 根据值进行计算返回
      return (index + 1) + (currentPage - 1) * pageSize;
    },
}