Chapter 9 discussion
Hey there!
Thanks for the book… It’s very well written…
Got a question on Chapter 9… I think that I understand everything except one key part. I am not sure how the DetailItem component is being “bound to the Outlet” element within the Details component.
Is it the fact that the “First element in the nested Route feeds designated element into the outlet?” And dynamic routes are coming in chapter 10? 
Thanks…
Feeding into Outlet is done by React Router. The first selected route (in this case Details) is rendered where the Routes block is located. Once Details is rendered, it’s child route DetailItem is rendered in the Outlet within Details.
This section of the React Router tutorial may be helpful: Tutorial v6.14.2 | React Router
Or this animation where you mouse over the different components at the top: https://remix.run/_docs/routing (note it is using 3 levels of nesting and therefore would have three Outlets: one in Root where Sales is rendered, one in Sales where Invoices is rendered, and one in Invoices where the specific invoice is render). I don’t see matching code for that example so feel free to ignore it if it’s confusing.
Is that helpful?
Hi Loren,
I got it… (Or I rationalized it to myself anyway… )
I am now envisioning that when App renders Details via the first route, the ‘Outlet’ goes BACK to the parent (App) and which says ‘OK, what nested route matches next?’, which is then DetailItems and that element is injected into the location specified by the Details component…
Is this close? (Thanks for the examples… I will check them out… )
Good question, I’m not sure if DetailItems would render or not if there was no Outlet. You could add a console.log in it and find out.