javascript - 如何在JSX中使用参数调用函数？

我正在尝试使用该项目作为React中的参数创建一个listitem点击监听器。但是现在在加载页面时调用了itemClick函数，而不是单击某个项目时。

itemClick = (item) => {
  console.log(item)
}

render(){
        return(
            <Fragment>
                {this.state.list.map(item=> (
                   <tr onClick={this.itemClick(item)}>
                    <td>{item.firstname}</td>
                    <td>{item.lastname}</td>
                   </tr>
                ))}
            </Fragment>
        )
    }

当我这样做时，单击该函数将被调用，但我无法获取参数

<tr onClick={this.itemClick} >

救命？

最佳答案

通过编写this.itemClick(item)，您可以直接在渲染上调用itemClick。您可以改为创建一个新的内联函数，该内联函数在调用itemClick时会调用。

<tr onClick={() => this.itemClick(item)}>

关于javascript - 如何在JSX中使用参数调用函数？，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/53279031/

itemclick

javascript - 如何在JSX中使用参数调用函数？