return for proper rendering

[paybosllc]

works with return, don't know if adding <> </> would be better.

[nx-cloud]

☁️ Nx Cloud Report

We didn't find any information for the current pull request with the commit 6cca26c.
You might need to set the 'NX_BRANCH' environment variable in your CI pipeline.

Check the Nx Cloud Github Integration documentation for more information.

---

Sent with 💌 from NxCloud.

[netlify]

✅ Deploy Preview for redwoodjs-docs ready!

Name	Link
🔨 Latest commit	6cca26c
🔍 Latest deploy log	https://app.netlify.com/sites/redwoodjs-docs/deploys/62f597c9a7a215000853207d
😎 Deploy Preview	https://deploy-preview-6205--redwoodjs-docs.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.

---

To edit notification comments on pull requests, go to your Netlify site settings.

[Tobbe]

This is the same as #6214 I closed that one, because the syntax is valid. But now I'm starting to doubt myself. Why do we get two PRs for the exact same thing so close to each other? Is something confusing here that we need to change?

[paybosllc]

This is the same as #6214 I closed that one, because the syntax is valid. But now I'm starting to doubt myself. Why do we get two PRs for the exact same thing so close to each other? Is something confusing here that we need to change?

I was working through your tutorial and I was getting a 'render error'. Adding the return to this component fixed the issue. I'm not an expert on react but I'm wondering if it has to do with scoping of the parent components.

[Tobbe]

Can you share a screenshot of the error in your editor please?

[paybosllc]

Can you share a screenshot of the error in your editor please?
Note: My 'tutorial' is developed with TypeScript.

Just recreated this when clicking from the 'home page' to a specific article entry.

Added the return ( <Component> ) and rendering is good.

[Tobbe]

It's super weird, because the change you've suggested is a syntax error. It would have to be curly braces, not regular parentheses for the return to even be valid. Can you also share a screenshot of your editor with this code please?

[Tobbe]

Okay, yeah, I think I know what's going on.

You had this, right?

And then you just removed all that inner code, leaving just <Article .... Am I right? But you didn't see (because we didn't highlight) that { changed to ( in this code snippet

[paybosllc]

It's super weird, because the change you've suggested is a syntax error. It would have to be curly braces, not regular parentheses for the return to even be valid. Can you also share a screenshot of your editor with this code please?

Here's the code change I made to 'fix' the rendering issue.

[Tobbe]

To make this less confusing I think we should keep the curly braces from the first code block in the second as well. And add the return statement, because now it's needed.

[Tobbe]

It's super weird, because the change you've suggested is a syntax error. It would have to be curly braces, not regular parentheses for the return to even be valid. Can you also share a screenshot of your editor with this code please?

Here's the code change I made to 'fix' the rendering issue.

Thank you! Just as I expected, you had the curly braces { still left in there from the first example. And then you do need a return statement. Had you changed to ( as the second example shows it would have worked without the return statement like the example shows.

I can totally see how this is all super confusing. Sorry!

[paybosllc]

Okay, yeah, I think I know what's going on.

This is what was there following the tutorial.
https://redwoodjs.com/docs/tutorial/chapter2/routing-params

**I see it is the difference between '{' and '('. I'll make the change. I didn't see the difference in the doc. I was just looking at the highlighted line **

[Tobbe]

Exactly 🙂

[paybosllc]

going to close and let the rw team address the docs.

[Tobbe]

I made a PR that changes to { return <Foo /> }
#6224