在React Bootstrap表中隐藏列的问题

Question

我当前正在使用react bootstrap表，并且运行良好。 我有一个关于切换列可见性的问题。 我动态填充列，并有一个带有选项作为列名的选择框。 onchange事件可切换列的可见性。 但是这部分不起作用。我已经使用ref来标识每一列。 _this.setState在onHeaderClick中不起作用。 这是代码示例。

...
function renderTable(record_set, columns, per_page_list, size_per_page, column_format) {
    var ReactBsTable = window.BootstrapTable;
    var Table = function (_React$Component) {
        _inherits(Table, _React$Component);

        function Table() {
            _classCallCheck(this, Table);

            var _this = _possibleConstructorReturn(this, (Table.__proto__ || Object.getPrototypeOf(Table)).call(this));

            _this.onHeaderClick = function () {
                var val = event.target.options[event.target.selectedIndex].value;
                _this.setState(_defineProperty({}, val, !_this.state[val]));
            };

            _this.state = {};
            return _this;
        }

        _createClass(Table, [{
            key: 'render',
            value: function render() {
                var options = {
                    ...
                };

                var columnsList = columns.map(function (column, index) {
                        var colRef = 'columnref' + (index + 1);
                        this.state[colRef] = false;

                        return React.createElement(
                                TableHeaderColumn,
                                {   
                                    ref: colRef,
                                    dataField: column,
                                    hidden: this.state[colRef],
                                },
                                column
                        );
                }, this);

                var optionsList = columns.map(function (name, index) {
                        var refIndex = index + 1;
                        return React.createElement(
                                                'option',
                                                { value: 'columnref' + refIndex },
                                                name
                        );
                });

                return React.createElement(
                    'div',
                    { id: 'bootstrapTableContainer' },
                    React.createElement(
                        'select',
                        { ref: 'toggle_cols', onChange: this.onHeaderClick },
                        React.createElement(
                            'option',
                            { value: 'default' },
                            'Show/Hide'
                        ),
                        optionsList
                    ),
                    React.createElement(
                        BootstrapTable,
                        { ref: 'bootstrapTable', data: record_set, ... },
                        columnsList
                    )
                );
            }
        }]);

        return Table;
    }(React.Component);

    ReactDOM.render(React.createElement(Table, null), document.getElementById("..."));
}

谢谢。