reactjsreact-data-table-component

react data table component clicking on a row and triggering an event

I have a react DataTable component like below:

<DataTable
     title="Your Tickets"
     columns={columns}
     style={{backgroundColor: '#000'}}
     data={tickets}
     pagination
     defaultSortAsc={false}
     defaultSortField="updated_at"
     customStyles={customStyles}                                        
                                    />

All i'm trying to achieve is when i click on a row, i want to show the ID of that specific row. How can i do that?

Solution

  • I'm not sure what you mean by "show". But you can get your id by onRowClicked.

        const handleRowClicked = row => {
        console.log(row.id)
    }

    <DataTable
        columns={columns}
        data={tickets}
        onRowClicked={handleRowClicked}
    />