element中table表格生成序号

scope.$index

        <el-table-column
              label="序号"
              align="center"
              width="80"
              >
                <template slot-scope="scope">
                  <div :class="listBgColor[scope.$index+1+myIndex]">
                    {{scope.$index+1+myIndex}}
                  </div>
                </template>
              </el-table-column>        

前三项加置顶背景

 data() {
    return {
    
      listBgColor: {
        '1': 'listBgFirst',
        '2': 'listBgSecond',
        '3': 'listBgTthird',
      },


    }
}

背景样式

.listBgFirst{
  color:#fff;
  background: url("../../../assets/img/first.png") no-repeat
    center;
  background-position-x: 17px;
  background-size: 32px 20px;
}
.listBgSecond{
  color:#fff;
  background: url("../../../assets/img/second.png") no-repeat
    center;
  background-size: 32px 20px;
  background-position-x: 17px;
}
.listBgTthird{
  color:#fff;
  background: url("../../../assets/img/third.png") no-repeat
    center;
  background-size: 32px 20px;
  background-position-x: 17px;
}
原文地址:https://www.cnblogs.com/ll15888/p/13293529.html