Part.1 示例

当我们想在 el-table 中添加序号列时,如下:

<el-table-column
label="序号"
type="index"
width="50"
align="center">
</el-table-column>

Part.2  问题

我们会惊奇的发现,我们翻页时,序号永远都是从 1 开始。因为每一次翻页都是根据当前数据的 index 显示,所以我们需要进行自定义

Part.3  解决

关键代码:

(page - 1) * pageSize + scope.$index + 1 // (当前页 - 1) * 当前显示数据条数 + 当前行数据的索引 + 1

改造如下:

<el-table-column
label="序号"
type="index"
width="50"
align="center">
<template scope="scope">
<span>{{(page - 1) * pageSize + scope.$index + 1}}</span>
</template>
</el-table-column>

完美解决!!!

element-UI el-table添加序号列时序号永远都是从1开始?的更多相关文章

  1. (Element UI 组件 Table)去除单元格底部的横线

    Element UI 组件 Table 有一个属性 border,添加它可以增加纵向边框,但是无法控制横线边框,因此即使是最简单的 el-table,也会包含一个底部横线. 这个底部横线其实是一个 b ...

  2. [转] BootStrap table增加一列显示序号

    原文地址:https://blog.csdn.net/aboboo5200/article/details/78839208 最近由于项目需要,使用BootStrap table做数据展示,其中要在第 ...

  3. 怎么样使element ui 的table某列变色

    第一步.在el-table里面加上:row-style="rowClass" <el-table :data="targetCarList" border ...

  4. Element UI的Table用法

    Table 表格 用于展示多条结构类似的数据,可对数据进行排序.筛选.对比或其他自定义操作. ¶基础表格 基 2016-05-02 王小虎 上海市普陀区金沙江路 1518 弄 2016-05-04 王 ...

  5. sql在添加新列时同时指定default约束名称

    alter table tab_testadd col_test NOT NULL CONSTRAINT DFtab_test_col_test DEFAULT 1 引用:http://www.uzz ...

  6. Element Ui中table实现表格编辑效果

    主要以css实现 .tb-edit .el-input, .tb-edit .el-input-number, .tb-edit .el-select { display: none; width: ...

  7. element ui 合计/table show-summary

    在el-table 上面加上show-summary就可以对table的数据进行合计 但是上次出现了合计栏有的为空,有的合计不对的情况,如果出现的是空,那么说明你渲染的数据有undefine(即后台返 ...

  8. element ui里面table分页,页数从0开始的怎么做?

    需求: 后台请求的接口是从0页开始的,但是pagination是从1开始的,就是在点击pagination的第1页是后台转0 1首先在data里面定义为1,其他地方也是定义1 return { for ...

  9. element ui的table的头部自定义

    <el-table-column label="级别" min-width="120" prop="clueLevel" align= ...

随机推荐

  1. RMQ(Range Minimum Query)问题(转)

    问题描述 RMQ问题是求给定区间中的最值问题.对于长度为n的数列A,回答若干查询RMQ(A, i, j).返回数组A中下标在[i,j]里的最小值的下标. 比如数列 5,8,1,3,6,4,9,5,7 ...

  2. java 类属性、方法加载的顺序

    1.静态变量 2.静态代码块 3.局部代码块 4.构造函数 5.普通代码块 6.静态方法 7.普通方法 8.普通属性

  3. Python3中 对local和nonlocal 关键字的改善认识(新手向)

    nonlocal关键字用来在函数或其他作用域中使用外层(非全局)变量. nonlocal用于声明,修改嵌套作用域(enclosing 作用域,外层非全局作用域)中的变量,如下实例: #!/usr/bi ...

  4. [转]python_常用断言assert

    原文地址:http://www.jianshu.com/p/eea0b0e432da python自动化测试中寻找元素并进行操作,如果在元素好找的情况下,相信大家都可以较熟练地编写用例脚本了,但光进行 ...

  5. C# a标签请求下载文件

    服务器文件后台处理方式: a标签: <a href="/FileUpload/DownloadFile?file=/UploadFiles/File/bfcd676b-13a8-419 ...

  6. P5071 [Ynoi2015]此时此刻的光辉

    传送门 lxl大毒瘤 首先一个数的因子个数就是这个数的每个质因子的次数+1的积,然后考虑把每个数分解质因子,用莫队维护,然后我交上去就0分了 如果是上面那样的话,我们每一次移动指针的时间复杂度是O(这 ...

  7. linux mysql 8 安装

    http://blog.itpub.net/31015730/viewspace-2152272/ https://blog.csdn.net/HaHa_Sir/article/details/805 ...

  8. Hdu 3488 Tour (KM 有向环覆盖)

    题目链接: Hdu 3488 Tour 题目描述: 有n个节点,m条有权单向路,要求用一个或者多个环覆盖所有的节点.每个节点只能出现在一个环中,每个环中至少有两个节点.问最小边权花费为多少? 解题思路 ...

  9. BZOJ 3224 SBT 普通平衡树

    复习了一下SBT的模板,但是BZOJ不知道为什么注册不了,所以就没交,测了样例能过! #include <bits/stdc++.h> #include<algorithm> ...

  10. KMP HDOJ 4300 Clairewd's message

    题目传送门 题意:完全不懂,最后还是看题解才理解了.第一行字符串是密文变成明文的规则,比如第二个样例:“qwertyuiopasdfghjklzxcvbnm”,‘q'对应的明文为’a','w'对应'b ...