react-table render component inside data
In addition to @Clarity's answer, there's also a possibility to access the cell's value at the Cell
's property level:
const columns = [
{
Header: "Image",
accessor: "imageUrl",
maxWidth: 70,
minWidth: 70,
Cell: ({ cell: { value } }) => (
<img
src={value}
width={60}
/>
)
}
];
You're passing a react component to a data field that expects a string. Try customising your cell via Cell
props:
const columns = [
{
Header: "Image",
accessor: "imageUrl",
maxWidth: 70,
minWidth: 70,
Cell: props => <PlaceholderImage width={60} textColor="#fff" text="Image" />
}
];