[Suggestion]: Change the error message "Objects are not valid as a React child (found: object with keys {aaa, bbb}). If you meant to render a collection of children, use an array instead.

Summary

You get the error message above when you create a functional component and omit to surround the properties with curly braces {}.

The message should be more directive.

Page

No response

Details

I think everybody does this when they first create a component. Type the error in your search engine, and you will see thousands of people asking the same question. For the sake of argument I attempted to "use and array instead" and got even more mysterious messages.

I believe the error message should be more like (for a component called MyComponent ) :

MyComponent is a functional component, and as such groups together all properties from the JSX tag into a single object. To use those properties directly in the body of MyComponent , surround the list of properties with curly brackets, such as MyComponent({foo, bar}). For more information, read https://react.dev/learn/passing-props-to-a-component .

Non è indicato alcun file sorgente né alcun test. Per prima cosa verifica se questo messaggio di errore appartiene a react.dev o al runtime di React, quindi individua il messaggio esistente e i relativi test. Il lavoro è completato quando la responsabilità è chiara e il messaggio fornisce indicazioni concrete senza fuorviare gli utenti riguardo a functional components o JSX props.