I want to render a component in another component. By directly exporting to a chrome debug window, I tested the following code:
function test() {
return <p>Test</p>;
}
function app() {
return <test />;
}
export default app;
I expect the result to be equivalent to:
function app() {
return <p>Test</p>;
}
export default app;
Which should output:
Instead, I get this:
Any insight appreciated. I will provide additional information on request, but I am unsure what could be missing.
p.s. ignore blur on address bar, just using chrome account
CodePudding user response:
I would first try capitalizing your components i.e.
function Test () {
return <p>Test</p>
}
function App () {
return <Test/>
}
This could be a similar question: ReactJS component names must begin with capital letters?