1
  1. 我使用来自服务器的 ajax 数据（使用 axios）创建 react-bootstrap-table。然后我更改了一个查询参数（this.state.type）并需要从服务器重新加载数据。我需要将新数据设置为状态，如何用新数据重建表？这是我的代码：

var Calls = React.createClass({
    getInitialState: function() {
        return {
            visible: false,
            products: [],
            callType: '1',
            type_: 1
        };
    },componentDidMount: function () {
        var _this = this;
        axios
            .get( 'stat_calls', {
                    params: {
                        type: _this.state.type_,
                    }
                }
            )
            .then(
                function (response) {
                    _this.setState(
                        {
                            products: response.data
                        }
                    )
                }
            )
            .catch(function (error) {
                console.log(error);
            })
    },
    readmoreClick: function(e) {
        e.preventDefault();
        var flag = this.state.callType;
        if(flag == '2') flag = '1'; else flag = '2';
        this.setState({callType: flag, type_: flag});
    },
    

    render: function() {
    
        return (
            <div>
 
                <a href="#" onClick={this.readmoreClick} >{this.state.callType }</a>
                
                <BootstrapTable search={ true } pagination data={this.state.products} striped={true} hover={true}>
                    <TableHeaderColumn dataField="uniqid" isKey={true} dataAlign="center" dataSort={true}>uniqID</TableHeaderColumn>
                    <TableHeaderColumn dataField="begin" dataSort={true}>Начало</TableHeaderColumn>
                    <TableHeaderColumn dataField="talkTime" dataSort={true}>Время разговора (c)</TableHeaderColumn>
                    <TableHeaderColumn dataField="support" dataSort={true}>Оператор</TableHeaderColumn>
                    <TableHeaderColumn dataField="number">Номер</TableHeaderColumn>
                    <TableHeaderColumn dataField='button' dataFormat={this.cellButton.bind(this)} />
                </BootstrapTable>

            </div>
        );
    }
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react-dom.min.js"></script>

  1. 如何为列制作过滤器，以便它可以显示两个值之间的间隔（例如，01/04/2017 - 05/04/2017）
4

0 回答 0