Javascript 需要访问在“地图”函数中创建的已单击“li”的“id”

我正在渲染由

li

元素表示的工作列表的“行”，这些元素是通过在保存工作列表数组的道具上调用

map

创建的

每个

li

都有一个

onClick

处理程序，我需要在该处理程序中访问与单击行关联的

id

，以便显示带有该

id

的作业列表的详细页。请注意，

map

将工作列表的

id

值添加为

li

元素的

键

属性

map

函数如下所示：

var jobListRow = this.props.joblists.map(function(jobrowobj) {
  return (
    <li key={jobrowobj.id} onClick={this.handleClick}>
      <div>bla bla</div>
      <span>bla bla</span>
    </li>
  );
});

---

在处理程序内部，我希望使用单击的

li

的

target

来获取该

li

的

键

属性的值，但是返回的

target

似乎每次都不同，并且恰好是

li

的不同子元素。如何访问单击的

li

的

键？或者，用不同的措辞：如何访问已单击的作业列表的
id
？
这应该可以，您需要有正确的上下文绑定：

var jobListRow = this.props.joblists.map(function(jobrowobj, i){
    return(
        <li key={jobrowobj.id} onClick={this.handleClick.bind(this,i)}>
            <div>bla bla</div>
            <span>bla bla</span>
        </li>
    )
});

 handleClick: function(i) {
    console.log('You clicked: ' + this.props.joblists[i]);
 }

var jobListRow=this.props.joblists.map（函数（jobrowobj，i）{
返回(

布拉布拉
布拉布拉

)
});
handleClick：函数（i）{
log（'您单击：'+this.props.joblists[i]）；
}

在此处找到此实现：

它似乎适合你的需要。希望有帮助
映射函数有一个选项，可以将“this”作为第二个参数传递。我是这样做的

    var vm = this;
    var jobListRow = this.props.joblists.map(function(jobrowobj){
        return(
            <li key={jobrowobj.id} id={jobrowobj.id} onClick={this.handleClick}>
                <div>bla bla</div>
                <span>bla bla</span>
            </li>
        )
    }, vm);

    handleClick: function(event) {
      console.log('You clicked: ' + event.target.id);
    }

var vm=this；
var jobListRow=this.props.joblists.map（函数（jobrowobj）{
返回(

布拉布拉
布拉布拉

)
}，vm）；
handleClick:函数（事件）{
console.log（'您单击：'+event.target.id）；
}
似乎仍然不起作用。您可以通过以下链接访问我的代码：每次单击行时，仍然会得到不同的子元素。类似这样的事情：第一次单击：7.9英里外第二次单击：作业1我不知道访问clickhandler中id的最佳方式，如果有其他最佳选项或解决方案，我将不胜感激。您要访问的不是数据reactid，而是您的密钥检查更新是否使用ReactNative？没有一个是本地的。将onPress与TouchableHighlight一起使用。
    var vm = this;
    var jobListRow = this.props.joblists.map(function(jobrowobj){
        return(
            <li key={jobrowobj.id} id={jobrowobj.id} onClick={this.handleClick}>
                <div>bla bla</div>
                <span>bla bla</span>
            </li>
        )
    }, vm);

    handleClick: function(event) {
      console.log('You clicked: ' + event.target.id);
    }