State Preservation & Resetting
React state belongs to a component's position and identity in the rendered tree. Moving, replacing, or keying a component differently can change whether state is preserved.
This is why conditional rendering can produce surprising state behavior. Two different conceptual screens should not necessarily share a component identity just because they occupy the same position.
Keys are useful beyond lists. A form can use a user ID as a key to reset local state when switching between users.
Key Takeaways
- State is associated with component identity in the tree.
- Changing keys is an explicit reset mechanism.
- Model screen identity deliberately when local state matters.