关于element-ui中的Table 表格,如何让索引延续类似于id效果

        首先表格中自带一个 type= 'index',这个属性可以是当前列 以索引 1,2,3,4,5 代替,但每一页它都会重置,有没有一种方法可以是他继承上一页的index呢 ,其实组件表单中给了一种方法

 <el-table-column
      type="index"
      :index="indexMethod">
 </el-table-column>

        官方给出的解释是:通过给 type=index 的列传入 index 属性,可以自定义索引。该属性传入数字时,将作为索引的起始值。也可以传入一个方法,它提供当前行的行号(从 0 开始)作为参数,返回值将作为索引展示。

        我们知道当给定 indexMethod为一个值时,当前页面会根据indexMethod的值为起始值来递增 

        假设给定值25,则当前页面的序号就为25,26,27,28,29,30  

那么就出现了一个问题,我们怎么知道当前页面应该给什么初始值

我自己的一个解决方案是,根据当前分页来计算

当我们选择第二页是,indexMethod的值就应该为前面的页数乘每页多少条 代码如下: 用计算属性最为合适

  computed: {
    indexMethod: function() {
      return (this.pagination.page - 1) * (this.pagination.pagesize) + 1
    }
  }

前面的页数就是当前页数-1 ,  而indexMethod的初始值会作为当前页面的第一个值,所以最后该值要+1

效果如下

 

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值