Error is thrown when an Object is directly being passed to be rendered as a component child OR props.
React does not support objects being rendered directly.

Normally, to render objects we can access a value by accessing key of object

let personObj = {name : “DummyName”}

Try accessing like this


Another option is to iterate over object, i.e.

{Object.keys(personObj).map((key) => (
  <div key={key}>
    {key}: {personObj[key]}

This will render the whole object with key-value pair.

Support On Demand!