custom cell in table

Hello,

I added my action buttons using customBodyRender:

```javascript
{
name: "Action",
options: {
filter: true,
sort: false,
empty: true,
customBodyRender: () => {
return (

);
}
}
},
```
And in table options, I use onRowClick to get the data (included an object of the component ) from the row clicked:

```javascript
const options = {
filter: true,
download: false,
selectableRows: false,
filterType: "dropdown",
responsive: "scroll",
rowsPerPage: 10,
customToolbar: () => (

),
onRowClick: (event, rowData) => {
this.handleClickedActionButton(event, rowData);
},
};
```
As I have 3 buttons in one cell (view, edit and delete) for each row, I need to know which button was clicked in order to perform an action to the data (call a function).

I tried using event.currentTarget to get the id of the button clicked, use that id in a switch statement in order to identify which one was and base on that call the correct function.

Something like this:

```javascript
onRowClick: (event, rowData) => {
this.handleClickedActionButton(event, rowData);
},
};
//
handleClickedActionButton = (event, rowData ) => {
const buttonID = event.currentTarget.dataset.id;
switch (buttonID) {
case "btnView":
console.log("View");
break;
case "btnEdit":
console.log("Edit");
break;
case "btnDelete":
console.log("Delete");
break;
default: console.log("No action button clicked.");
}
};
```
But I just get an error saying "Type error: event.currentTarget is undefined".

How can I implement this idea in a better way? T.T

_Originally posted by @ladyllma in https://github.com/gregnb/mui-datatables/issues/297#issuecomment-480146733_