Search code examples
reactjsmaterial-table

React Material-Table how to pass rowData argument?


I have been trying to use material-table for react, my code grabs the data from the API and then I have to open a Popup window that will call another API, and for that I would need the rowData.ID_value_to_call.

For now I'm simply trying to see the rowData but I can't seem to find the right syntax, as I keep getting "rowData' is not defined no-undef".

Code for Material-Table here:

<MaterialTable
            columns = {columnsSetup}
            options={{
                showTitle: false, 
                search: false,
                filtering: true
            }}

            onRowClick={(console.log(rowData))} <----- issue right here

            data={query =>
              new Promise((resolve, reject) => {
                let url = GET_ORDERS_URL
                url += 'qtt=' + query.pageSize
                url += '&page=' + query.page
                console.log(url);
                fetch(url)
                  .then(response => response.json())
                  .then(result => {
                    resolve({
                      data: result.data,
                      page: result.page,
                      totalCount: result.totalElems
                    });
               })
           })
         }
/>

Solution

  • onRowClick has a signature of (event, rowData). See the description on this page: https://material-table.com/#/docs/all-props

    So, change it to:

    onRowClick={(event, rowData) => console.log(rowData)};
    

    this is a valid function with the required signature. Your current code is calling the console.log function directly instead of passing a function that can be called when the row is clicked.