Skip to content

Fix Uncaught Error Objects are not valid as a React child

New Courses Coming Soon

Join the waiting lists

This error might happen because you’ve got a React component and you’re rendering a prop in the JSX, like this, but you forgot to destructure the prop when initializing the component parameters:

function MyComponent(test) {
	return <p>{test}</p>

You should do this instead:

function MyComponent({ test }) {
	return <p>{test}</p>

The component receives a props object and we commonly use object destructuring to get the props “mapped” to variables, like {test} in our example.

→ Get my React Beginner's Handbook
→ Read my full React Tutorial on The Valley of Code

Here is how can I help you: