React/TypeScript · Module 5
Answers and explanations · Keep identity through changing lists
Compare these references after your own attempt. You can read them at any time; they do not record a live model or vendor run.
React/TypeScript · Module 5
Compare these references after your own attempt. You can read them at any time; they do not record a live model or vendor run.
The parent owns an array containing garden-morning. Filtering removes a card from the visible tree but does not remove that ID from parent state. When the card returns, its title comes from current event data, and its saved flag is derived by membership in savedIds. It does not restore a copied event object or rely on the old card instance surviving.
With index keys, removing the first event shifts the remaining records into old positions. An expanded state can be associated with the wrong event. Random keys force fresh identity each render and discard state. Use event.id on the immediate mapped item. Sorting a copied array should move a card while retaining its key. Filtering a card out unmounts it, so its own local expansion state can reset even with a correct key. The experiment should distinguish these cases.
Use setSavedIds([]) to clear all current saved IDs; this creates a new array rather than mutating the old one. A summary of all remembered IDs can read savedIds.length. A summary of currently available saved records can count events.filter(event => savedIds.includes(event.id)). Both policies can be coherent if the wording is explicit. Hidden-by-filter cards should not change the count of all saved records. Verify the button's aria-pressed state after toggling and clearing. Persistence is intentionally postponed until lesson 07.