The ability to reply to discussions is limited to PRO members. Want to join in the discussion? Click here to subscribe now.

Break up components into smaller pieces using Functional Components

Break up components into smaller pieces using Functional Components

2:21
We are going to ensure our app is structured in a clear way using functional components. Then, we are going to pass those components state values from the parent class component.
Watch this lesson now
Avatar
egghead.io

We are going to ensure our app is structured in a clear way using functional components. Then, we are going to pass those components state values from the parent class component.

Avatar
Stephen Bussard

CAUTION: I recently ran into a massive ui problem when I used the index argument of the map function as the key to a mapped react component.

The state was a list of objects.
The container component sorted the list of objects in the state and mapped it to an smaller ui components.
It worked completely as expected until I added a new item to the state and sorted / mapped it again.
At that point react got confused about which properties belonged to which mapped component, and it had me questioning everything I knew about react.
Once I switched to using a uuid as a key for the mapped component, everything started working well again.

In reply to egghead.io
Avatar
Rory

Thanks for your feedback, I updated my video

In reply to Stephen Bussard
HEY, QUICK QUESTION!
Joel's Head
Why are we asking?