给antd中table表格奇偶行设置不同样式（背景颜色交替）

今天在写大屏的时候碰到一个需求，需要将table表格展示的数据每一行背景颜色交替，翻阅资料后，完成了这个需求。
如下图：

table组件中有个rowClassName属性，让我们可以通过给每一行添加不同的类名然后设置不同行的样式
jsx代码：

import React, { Component } from 'react';
import {Layout,Select,Table} from 'antd'
import  './index.less'
const { Option } = Select;
const {Sider, Content } = Layout;
class Security extends Component {
    constructor(props) {
        super(props);
        this.state = {  };
    }
    
    getRowClassName = (record, index) => {
      let className = '';
      className = index % 2 === 0 ? "oddRow" : "evenRow";
      return className
    }
    
    render() {
      
      
        return (
        <Layout>
            
            <Table showHeader={false} dataSource={dataSource} columns={columns} pagination={false} rowClassName={this.getRowClassName}/>
           
        </Layout>
        );
    }
}

export default Security;

样式代码：

.oddRow {
        background: #113057;
      }

      .evenRow {
        background: #1D81C7;
      }

参考：https://blog.csdn.net/tianxintiandisheng/article/details/107840102