el-table中奇偶行背景色显示不同的颜色

<el-table
   ref="singleTable" :data="tableData" highlight-current-row @current-change="handleCurrentChange" :header-cell-style="{background:'#ECF0FB'}" :row-class-name="tableRowClassName" style="width: 100%"> <el-table-column type="index" width="50"></el-table-column> <el-table-column prop="nickname" label="昵称"></el-table-column> <el-table-column prop="emailAddress" label="邮箱地址"></el-table-column> <el-table-column prop="updateDate" label="创建时间"></el-table-column> <el-table-column label="操作" align="center"> <template slot-scope="scope"> <div v-if="scope.row.nickname==$store.state.basicInfo.xm"> <el-button @click="transform({id:scope.$index,type:'edit'})">修改</el-button> <el-button @click="handleDelete(scope.$index)">删除</el-button> </div> <div v-else> <el-button @click="transform({id:scope.$index,type:'edit'})">修改</el-button> <el-button @click="handleDelete(scope.$index)">删除</el-button> </div> </template> </el-table-column> </el-table>　

export default {

   data(){

     return{

       currentRow: null,

    }

  }，

methods:{
   //奇偶行背景色不同 
 setCurrent(row) { this.$refs.singleTable.setCurrentRow(row); }, handleCurrentChange(val) { this.currentRow = val; }, tableRowClassName({row, rowIndex}) { if ((rowIndex+1) % 2 === 0) { return 'success-row'; } return ''; }, }

}

.el-table .success-row {
    background: #F3F3F3;
}