Retour à la leçon
Mission

Mission : traquer le bug de la case cochée fantôme

Diagnostiquer un bug d'attribution de state causé par key={index} et migrer vers une clé stable.

Commandes qui pourraient t’être utiles
id

Contexte

Sur TodoList.jsx, un utilisateur coche la première tâche de sa liste, mais visuellement c'est une tâche plus bas qui apparaît cochée. Le composant utilise {taches.map((tache, index) => <li key={index}><input type="checkbox" defaultChecked={tache.faite} />{tache.texte}</li>)}. Une insertion de nouvelle tâche en tête de liste précède toujours ce genre de bug dans les tickets remontés par les utilisateurs.