Episode 11 game · Chitragupta · Water

Catch the Key Thief

Kai ticks a quest, deletes it, and the next quest turns up ticked. Feel the tanuki swap name tags for seat numbers when a list is keyed by index, choose a key that belongs to the item, then prove every tick stays put through delete, add and sort.

ChitraguptaMy ledger records state by key, Kai. Tick Feed the koi and watch which line I write it on.
11Seal 11
kai.app/quests

Rendered with key={i}

    Chitragupta’s ledger the state React keeps, filed by key

      Each key gets one line. A row’s tick lives on its key’s line.

      1 · Feel the theft

      This list follows React’s rule: state is matched to rows by key, and Kai keys by index. Tick a quest, then change the order.

      State follows the key

      React matches rows by key and keeps each key’s state and DOM.

      Index is a seat number

      Delete, add or sort and key={i} hands one item’s state to another.

      Name it once

      Create an id with the item (crypto.randomUUID() or the database id) and key by it.