通过点击react.js传递ID [英] pass id through on click react.js

问题描述

下面是我的部分代码，但我的问题很简单，当用户单击 li 时，如何对我的函数说data-id ="1"?

Below is my partial code but my question is very simple, how can I get says data-id="1" to my function when user clicked on the li?

render(){
    return(
      <ul id="todo">
      {this.state.items.map((item,i) => 
        <li className='list-group-item' key={i} data-id={item.id}>{item.name}
        <button onClick={//how to pass item.id to my function?}>X</button>
        </li>
      )}
      </ul>
    ) 
  }

推荐答案

由于您已经在使用ES6，使用

Since you are already using ES6 - might be a little cleaner to use an arrow function here:

render(){
    return(
      <ul id="todo">
      {this.state.items.map((item,i) => 
        <li className='list-group-item' key={i} data-id={item.id}>{item.name}
        <button onClick={() => this.yourfunc(item.id)}>X</button>
        </li>
      )}
      </ul>
    ) 
}

这篇关于通过点击react.js传递ID的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！