Objects are not valid as a React child

  • React

What it means

The page tried to show a whole object (or a date, or a promise) where React needs text, a number or elements. It does not know how to turn it into something visible.

Why it happens

  • Rendering an API response or record directly, like {user} instead of {user.name}.
  • Rendering a Date object instead of a formatted string.
  • Rendering the result of an async function, which is a promise.

How to fix it

  1. Render the field you meant: {user.name}.
  2. Format dates first: {date.toLocaleDateString()}.
  3. Load async data first, then render it.

Let your AI find the cause

Paste this into Claude Code, Cursor, Lovable or whichever AI built your app. It looks first and changes nothing until you have read the answer.

My React app shows 'Objects are not valid as a React child'. Without changing anything yet, find where the object in the error message is rendered, and tell me which of its fields should be shown instead.