美文网首页
el-table 显示序号

el-table 显示序号

作者: 赛亚人之神 | 来源:发表于2018-05-03 13:28 被阅读106次

html

<el-table :data="tableData" stripe border :row-class-name="tableRowClassName">
              <el-table-column
                prop="module"
                :formatter="formatter"
                label="序号"
                width="50">
              </el-table-column>
</el-table>

javascript

// 在method 中加入如下方法:其中 tableRowClassName 的入参用到了析构
tableRowClassName({row, rowIndex}) {
        // 把每一行的索引放进row
        row.rowIndex = rowIndex
      },

      formatter(row, column, cellValue, index) {
        //放回索引值
        return this.param.page.pageSize * (this.param.page.pageNum - 1)  + 1 + row.rowIndex;
      },

说明:

row-class-name  行的 className 的回调方法, 也可以使用字符串为所有行设置一个固定的 className。  
类型: Function({row, rowIndex})/String

相关文章

网友评论

      本文标题:el-table 显示序号

      本文链接:https://www.haomeiwen.com/subject/rdbkrftx.html