Functions not valid as child React Origin: On your device Last updated 13 Oct 2026

Warning: Functions are not valid as a React child. This may happen if you return a Component instead of <Component /> from render.

A function (usually a component itself) was rendered instead of calling/rendering it as an element.

Exact message you may see Functions are not valid as a React childreturn a Component instead of <Component />
Seen on: React

Meaning

Writing {Header} instead of <Header />, or returning a component function rather than JSX.

Common causes

  • {MyComponent} instead of <MyComponent />
  • Passing a render function without calling it
  • Returning a component type from render

⚡ Quick fix

  1. Render as an element: <Header />
  2. Call render props: {renderItem(item)}

Detailed fix by platform

React

  1. {showHeader && <Header />}

How to diagnose

  1. Expression — Which {…} renders a function?
  2. Recent change — Did it start after a deploy, upgrade, or configuration change? Compare with the last working version.

🔧 Still not fixed?

Many errors look alike. If the steps above didn’t solve it, one of these is probably what you’re facing:

Where this error sits

Origin: On your device. Errors that are often confused with or caused by this one (click to open):

Adjacent JSX elements — Adjacent JSX elements must be wrapped in an enclosing tag. Did you want a JSX fragment <>...</>? (React)Adjacent JSX elementsDynamic server usage — Error: Dynamic server usage: Route /x couldn't be rendered statically because it used `cookies` (React)Dynamic server usageElement type is invalid — Error: Element type is invalid: expected a string (for built-in components) or a class/function (for composite components) but got: undefined (React)Element type is inval…Invalid DOM property — Warning: Invalid DOM property `class`. Did you mean `className`? (React)Invalid DOM propertynon-boolean attribute — Warning: Received `true` for a non-boolean attribute `x`. (React)non-boolean attributeNothing was returned from render — Error: Nothing was returned from render. This usually means a return statement is missing. (React)Nothing was returned …Objects are not valid as a React child — Error: Objects are not valid as a React child (React)Objects are not valid…React must be in scope — ReferenceError: React is not defined / 'React' must be in scope when using JSX (React)React must be in scopeFunctions…

Explore the map of this error Full error map →

🧠 Still stuck? Analyze your error

Paste the full message, response headers or stack trace — we'll detect the platform and point to the most likely cause.

💬 What worked for others

No tips yet — did something else fix this for you?

Share what worked for you

Tips are checked by an editor before they appear. Links are removed.