CODEWITHSUNDEEP
reactjsantd
Martin
Martin

Reputation: 21

Getting current table data from Ant Design Table

I'm using Ant design table for displaying some data. New data arrives every one second. When user clicks on button, I need to export current table data to XSL.

I'm getting current data in this way: 

onChange={(pagination, filter, sorter, currentTable) => this.onTableChange(filter, sorter, currentTable)}.

This thing works and gets me good and filtered data, but when I get new data, I can't get those new data because this function is not triggered while none of the filters or sort settings didn't change. Is there any way to get current table data without dummy changing filter to trigger onChange function?

Title and footer return only current page data.

Code show here

 {    <Table
                    dataSource={this.props.data}
                    rowKey={(record) => { return record.id}}
                    columns={this.state.Columns}
                    pagination={this.state.pageSizeOptions}
                    rowClassName={(record) => { return 
this.getRowClassNames(record) }}
                    expandedRowKeys={ this.state.expandedRowKeys }
                    expandedRowRender={record => { return 
this.getEventsRows(record) }}
                    onExpand={(expanded, record) => { 
this.onExpandRow(expanded, record.id) }}
                    expandRowByClick={false}
                    onChange={(pagination, filter, sorter, currentTable) 
=> this.onTableChange(filter, sorter, currentTable)}
                />
 }

Upvotes: 2

Views: 11135

Answers (2)

Niraj
Niraj

Reputation: 386

This is because you have taken either columns, datasource varibale as object instead of array. write this.state.someVariable=[] instead of this.state.someVariable = {}

Upvotes: 1

Sabri Şahin Can
Sabri Şahin Can

Reputation: 524

You can store pagination, sorter and filter data in your component state. Also you can pass these params to your redux state and store there. If you can share your code, i can provide more specific answers.

Below you can find my solution for permanent filter. I was sending filter params to API and get filtered data. If you want to filter it in the component, you can use component lifecycle or render method. 

onTableChange(pagination, filter, sorter){
    const { params, columns } = this.state;

    /** You can do any custom thing you want here. Below i update sort type in my state and pass it to my redux function */
    if(sorter.order != null)
        params.ordering = (sorter.order === 'descend' ? "-" : "")+ sorter.columnKey.toString();

    this.setState({params});
    this.props.listUsers(this.state.params);
}

Upvotes: 1

Related Questions