添加带有react-bootstrap-table2的列

时间:2019-07-09 13:15:33

标签: react-bootstrap-table

当您点击 expandRow 时,您还将看到将此列(单击)添加到表格中的图标。该函数在组件状态下更改columnList,我在GUI表中看到新列。但是此新列中没有数据被填充。

我尝试强制重新渲染组件,但无济于事。 json数据数组也存储在state.data中。知道如何强制表重新呈现新数据吗?

addColumn(event){
var column = event.currentTarget.getAttribute('field');
var columns = this.state.columns;
var columnName='_source.attrs.'+column;
var columnText = column.toUpperCase();
columns.push(
    {

            dataField: columnName,
            text: columnText,
            sort: true,
            headerStyle: {width: '15%'}        
    }
);
this.setState({columns: columns});
 this.forceUpdate();    

}

我的桌子:

 <BootstrapTable 
        bootstrap4 
        hover 
        expandRow = {
            expandRow
        }

        bordered ={false}

        keyField ="_id"

        data = {
            this.props.data
        }
        columns = {
            this.state.columns
        }
        pagination = {
            paginationFactory()
        }
        noDataIndication={ () => <NoDataIndication /> }
        /> 

0 个答案:

没有答案