Tengo un estado de matriz:
const [photos, setPhotos] = useState( [ { id:1, name:'Jack Stipen', isActive:true }, { id:2, name:'Reshma Karim', isActive:false }, { id:3, name:'Jahid Jader', isActive:false }, { id:3, name:'Bindu Jemaiya', isActive:false }, ] );Solo quiero que la propiedad de un objeto sea verdadera y el resto sea falsa .
Tengo una función para seleccionar una propiedad de objeto para que sea verdadera. ¡Pero deshecho!
const handleDefaultPhotoOnTable = ( id, e ) => { const exitPhotos = [...photos]; const selectTablePhotoIndex = exitPhotos.findIndex( photo => photo.id === photoId ); exitPhotos[selectTablePhotoIndex].isActive= e.target.checked; setPhotos( exitPhotos ); ........ };Aquí encuentras mi código HTML:
<tbody> { photos.map( ( photo ) => ( <tr key={photo.id}> <td>{photo.name}</td> <td className="text-center"> <input onChange={( e ) => { handleDefaultPhotoOnTable( photo.id, e ); }} name='isActive' checked={photo.isActive} type='checkbox' id='defaultId' /> </td> </tr> ) ) } </tbody>Por favor, ayúdame.
Puede usar un bucle de mapa para este caso como este:
setPhotos( photos.map((photo) => photo.id === photoId ? { ...item, isActive: true } : { ...item, isActive: false } ) );