vendredi 24 mai 2019

Select one only one row in ant-design table component

i'm having a problem here. It is mandatory for my project to user ant design. The link is here: https://ant.design/components/table The component i must use is a table component. When i click on a row i must dispatch an action. The problem i'm facing is that i must check only one row. As a result when i click on a row the checkbox in the previous row should be deselected.

I've tried to add some logic as you can see here:

class EvaluationDataTable extends React.Component {
  state = {
    selectedRowKeys: [], // Check here to configure the default column
  };

  onSelectChange = selectedRowKeys => {
    if (selectedRowKeys.length > 1) {
      const lastSelectedRowIndex = [...selectedRowKeys].pop();
      this.setState({ selectedRowKeys: lastSelectedRowIndex });
    }
    this.setState({ selectedRowKeys });
    console.log('selectedRowKeys changed: ', selectedRowKeys);
  };

  render() {
    const { selectedRowKeys } = this.state;
    const rowSelection = {
      selectedRowKeys,
      onChange: this.onSelectChange,
    };
    return (
      <React.Fragment>
        <div style= />
        <Table
          rowSelection={rowSelection}
          columns={columnEvaluation}
          dataSource={result}
        />
      </React.Fragment>
    );
  }
}```

But even if the selectedRow has the last checked row the no checkbox is checked. Any ideas?




Aucun commentaire:

Enregistrer un commentaire