Search code examples
reactjsmaterial-table

Reat Material-Table: CellStyle to access the full rowData information and not only field

I am trying to define the cell of a style using cellStyle but the information available on that is only the field associated to it. But I need to customize it according to other field information.

I saw this pull request da08676 but still I am not being able to use it.

When I do something like:

cellStyle: (value, rowData) => {
                return {backgroundColor: {rowData.color}}
              }

rowData is undefined.

Solution

  • It can actually be solved by using the 2 parameters function passed to cellStyle.

    cellStyle: (cellValue, rowData) => { 
      // OPEN YOUR CONSOLE
      console.log({ cellValue, rowData });
      // `rowData.color` will not be defined...
      // neither will `rowData.tableData.color`...
      return { backgroundColor: 'purple' }
    }

    The full answer can be found here: https://github.com/mbrn/material-table/issues/1991#issuecomment-640131927