特定のIDを表示する必要があります特定のリストをクリックすると

Question

ID のようなアイテムから特定の情報を取得する必要があります。私が得たリストはですが、私が直面していることは、 handleClickのパラメータとして、すべてのId from項目を表示します。それは明らかです。

特定のIDを取得するためにコードを変更するにはどうすればいいですか？あなたが使用することを何ができるか

handleClick(event) { 
    console.log(event); 
     alert(event); 
    } 


     <ul className="w3-ul w3-card-4 w3-yellow"> {this.state.post.map((item, index)=> { 
          return (
           <Link to="/displaylist" style={{textDecoration:'none'}} key={index} > 
            <li className=" w3-hover-green w3-padding-16" onClick={this.handleClick}> 
             <img src={require('./3.jpg')} className="w3-left w3-circle w3-margin-right " width="60px" height="auto" /> 
              <span>{item.Firstname}</span><br/><br/> 
            </li> 
           </Link> 

           )} 
          )} 
      </ul> 

Answer 1

されています。これはpartial applicationと呼ばれるものであるので、あなたはonClickに実行される関数を返しますIDを渡してコールバックを、初期化

handleClick(id) { 
    return function(event) { 
     console.log(id); 
    }; 
} 


<ul className="w3-ul w3-card-4 w3-yellow"> {this.state.post.map((item, index)=> { 
    return (
     <Link to="/displaylist" style={{textDecoration:'none'}} key={index} > 
      <li className=" w3-hover-green w3-padding-16" onClick={this.handleClick(item.id)}> 
       <img src={require('./3.jpg')} className="w3-left w3-circle w3-margin-right " width="60px" height="auto" /> 
       <span>{item.Firstname}</span><br/><br/> 
      </li> 
     </Link> 
     )} 
    )} 
</ul> 

。