react 项目中 element ui Table 添加单行选中状态（样式）

view层代码：

 <Table className="segmentsTable"
        style={ { width: '100%' } }
        columns={ this.getColumns() }
        data={ segmentsList }
        onRowClick={ (_row, _event, _column) =>this.handlerOnRowClick(_row, _event, _column) }
        rowClassName={ (_row, index) =>this.handlerRowClassName(_row, index) }
 />

js 方法：

    handlerOnRowClick = (_row, _event, _column) => {
        this.setState({
            curIndex: _row.row_index             // 在点击事件中就可以拿到row的index
        })
    }


    handlerRowClassName = (_row, index) => {
        _row.row_index = index;                 // 可以在这给row加入index
        if (index === this.state.curIndex) {
            return 'select-row';
        } else {
            return 'row-class';
        }
    }

state状态：

state = {
     curIndex: -1,
   };

less 样式代码：

        .select-row {
            background-color: #d0d1ff;
            &:hover {   
                td {
                    background-color: transparent;
                }
            }
        }
        .row-class:hover {
            td {
                background-color: #fafafa!important;
            }
        }