How do you pass a component into the attribute of a component in React?

Question

I have SplitPane component class with attributes body and side. I also have a Table component class I'm trying to insert but I keep getting an error.

<SplitPane side='hi' body=<MyTable /> />

will return

JSXAttribute expected node to be of a type ["JSXElement","StringLiteral","JSXExpressionContainer"] but instead got "CallExpression"

Answer 1

You need to wrap it in curly braces and remove the JSX. Just pretend it's a normal variable.

<SplitPane side='hi' body={MyTable} />

Answer 2

It should be <SplitPane side='hi' body={<MyTable />} />