I have a material table that currently displays the name and id
of data
. I am trying to also display mode
in the table but is a boolean instead of a string and integer. It refuses to display in the Mui-Table That is the only thing I can think of being the issue. I've tested and target_path
also works if I substitute it in for mode
.
I'd appreciate any help with this
export default function MuiTable(props)
data=props.data
return (
<div>
<MaterialTable
icons={tableIcons}
title="Title"
columns={[
{ title: 'ID', field: 'id' },
{ title: 'Name', field: 'name' },
{ title: 'Mode', field: 'mode'},
]}
data={data}
actions={[
{
icon: forwardRef((props, ref) => <Edit {...props} ref={ref} />),
onClick: handleEdit
},
{
icon: forwardRef((props, ref) => <DeleteOutline {...props} ref={ref} />),
onClick: handleDelete
},
{
icon: forwardRef((props, ref) => <NoteAddIcon {...props} ref={ref} color='primary'/>),
isFreeAction: true,
onClick: handleRoute,
}
]}
/>
</div>
);
I believe 'id', 'name', and 'mode' are being pulled from data
.
5: Object { id: 10, name: "Test", target_path: "/path/to/targets", … }
and expanded
id: 10
mode: true
name: "Test"
tableData: Object { id: 5 }
target_path: "/path/to/targets"
Material-table lets you to override a render of any column. For example:
<MaterialTable
// other props
columns={[
{
field: 'url',
title: 'Avatar',
render: rowData => (rowData.mode ? "True" : "False"),
}
]}
/>