ReactJS comment savoir quel tag a été cliqué?

Question

J'ai créé un tableau de balises de boutons et maintenant je veux être capable de gérer chaque bouton lorsque je clique dessus mais je ne sais pas comment gérer this.handleClickSelection() afin de savoir quel tag a été cliqué.

class Search extends React.Component 
{ 
constructor() 
{ 
    super(); 
    this.state = { entries : [], entries_audio : [], } 
} 

componentWillMount() 
{ 

    $.get('https://something', (data) => { 


     var entriesArray = []; 
     var entriesAudioArray = []; 
     for (var i = 0; i < data.stories.length ; i++) { 
      entriesArray.push(<button className ="entries" key={i} onClick={()=> this.handleClickSelection() } > {data.stories[i].title }</button>); 
      entriesAudioArray.push(data.stories[i]); 
     }; 
     this.setState({ indents : entriesArray, entries_audio : entriesAudioArray }); 
     console.log(this.state.entries_audio); 



    }, 'json'); 


} 


handleClickSelection() 
{ 
    alert("this particular button data"); 


} 


//more code below 

Answer 1

Vous pouvez lier votre gestionnaire de clic à l'index:

... onClick={this.handleClickSelection.bind(this, i)} 

puis handleClickSelection recevront l'index comme premier argument:

handleClickSelection(index, event) { 
    console.log('item pressed: ', index); 
} 

Answer 2

Nous utilisons bind pour cela. Comme:

onClick={this.handleClickSelection.bind(this, i)} 

qui passera i comme le premier paramètre dans votre méthode:

handleClickSelection(i)