关于 ReactJS+ES6 组件开发 重复渲染问题

大家好： 我的前端项目是 React+es6+redux+webpack 结构

功能很简单，获取数据，渲染列表，问题在于，我把列表渲染完之后，需要调一个 bootgrid 的 jQuery 库，去生成分页和自定义操作的界面操作和效果，那么，在初次加载的时候，没有问题，但是在做 select 筛选的时候， componentDidMount 里面的没办法再次调用 bootgrid 的 jQuery 库，这样就导致了重新渲染的列表没办法展示其效果。我琢磨了很长时间，没找到解决办法。
请问各位，是否有办法解决这个问题？？？  在线等！

简单代码如下：
class ClientsHistory extends Component {
constructor(props) {
    super(props);
    this.state = {list: []};
}
componentDidMount(){
    let that = this;
    $("#tb-grid-data").bootgrid();
    let grid = $("#tb-grid-devicelist").bootgrid({
        formatters:{
            "operation":function(column , row){ 
                return 'aaa';
            }
        }
    });
}
changeSelect(sel_val){
    this.setState({devicesn:sel_val});
    // $("#tb-grid-devicelist").bootgrid('reload');

}
render(){
    let devicelist = GetLocalData(device_data_key);
    var rows = [];
    if(devicelist != null){
        var sn = this.state.devicesn;
        devicelist.forEach(function(result, index){
            if(typeof sn != 'undefined' && sn != ''){
                if(result.sn == sn){
                    rows.push(
                        <ClientRows rowdata={result} key={index} />
                    );
                }
            }else{
                rows.push(
                    <ClientRows rowdata={result} key={index} />
                );
            }
        });
    }
    return(
        <div className="card z-depth-1">
            <div className="card-header">
                <div className="div-tips-left">
                    <Select1 changeselect={this.changeSelect.bind(this)}/> 
                </div>
            </div>
            <div className="table-responsive">
                <table id="tb-grid-devicelist" className="table table-striped">
                    <thead>
                        <tr>
                            <th data-column-id="sn">aa</th>
                            <th data-column-id="uptime">bb</th> 
                        </tr>
                    </thead>
                     <tbody>
                        {rows}
                    </tbody>
                </table>
            </div>
        </div>
    );
}

}