Tengo un botón que elimina una nota, y se supone que selecciona automáticamente la siguiente nota después de eliminar la primera nota. Sin embargo, no funciona y tengo este error Uncaught TypeError: Cannot set properties of undefined (setting 'selected')
import React, { useContext } from 'react'; import trashicon from '../../trashicon.png' import {NoteContext} from '../../noteContext'; const DeleteNote = () => { const [notes, setNotes] = useContext(NoteContext); const handleDeleteNote =()=> { const newNotesList = notes.filter(itemChecked=>itemChecked.selected===false) console.log(newNotesList[0]) for (let i = 0; i < notes.length; i++) { if(notes[i].selected === true) { newNotesList[i].selected = true; } } console.log(newNotesList); setNotes(newNotesList); } return ( <img src={trashicon} className="delete-icon" onClick={handleDeleteNote}/> ) } export default DeleteNoteEsta lógica es bastante incorrecta, ¿qué sucede si notes arr tiene 5 objetos y newNotesList devuelve 3 objetos diferentes? Entonces, cuando realice un bucle, actualizará los primeros 3 objetos incorrectos en la matriz newNotesList .
En mi opinión, esta debería ser la lógica correcta.
if (!newNotesList.length) return; for (let i = 0; i < notes.length; i++) { // } if(notes[i].selected === true) { const findElementInNewNotesList = newNotesList.find(el => el.id === notes[i].id); if(findElementInNewNotesList.id) newNotesList[i].selected = true; } De esta forma, encontrará el objeto coincidente SOLO en newNotesList .