0
votes

Comment comprendre un élément de tableau avec la clé de réagir JS

Je fais quelque chose dans l'image suivante:

J'ai écrit le code suivant: p>

{ persons.map((person) => <li key = {person.id}> 
  <Person name={person.name} number={person.number}/> 
  <Button text={'Delete'} handler={deleteHandler} /> 
</li>) }

javascript reactjs react-native react-hooks

0 commentaires

4 Réponses :

1
votes

{ persons.map((person) => <li key = {person.id}> 
  <Person name={person.name} number={person.number}/> 
  <Button text={'Delete'} handler={() => deleteHandler(person.id)} /> 
</li>) }
In your handler you can filter your array using person.id

0 commentaires

1
votes

Vous pouvez passer un identifiant ou un objet particulier à supprimer à l'intérieur de cette fonction xxx

supposant que vous avez

const [Personnes, SetPerson] = réacteur ([. .....]); xxx

0 commentaires

1
votes

Ajoutez d'abord des personnes à des données d'état comme xxx pré>

alors vous pouvez utiliser le code ci-dessous pour supprimer l'opération P>

deleteHandler = (person) => {
  this.setState( { persons :  this.state.persons.filter(function( obj ) {
    return obj.id !== person.id;
    })
  });
}


this.state.persons.map((person, index) => {

  return(
        <li key = {person.id}> 
        <Person name={person.name} number={person.number}/> 
        <Button text={'Delete'} handler={()=>{this.deleteHandler(person)}} /> 
        </li>
  )
})

0 commentaires

1
votes

Vous pouvez transmettre la clé et vérifier la touche pour trouver l'index pour supprimer un élément ou. Passez l'index sur DeleteHandler () directement à partir du gestionnaire de clic xxx

la fonction doit être xxx

0 commentaires