React & Modern Frontend (445 Qs)•Part 8: Advanced React Patterns, Portals & Performance (152 - 261)
Can I use keys for non-list items?
Keys are primarily used for rendering list items but they are not just for list items. You can also use them React to distinguish components. By default, React uses order of the components in
Practical Code Example
jsx
// Using keys for non-list items to reset component state:
function UserProfile({ userId }) {
// When userId changes, key changes, resetting entire form to initial state:
return <UserProfileForm key={userId} userId={userId} />;
}