Question

我正在尝试创建一个列表项单击侦听器，并将该项目作为React中的参数。但是现在在加载页面时调用了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} >

帮助？

Answer 1

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

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

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

1 个答案: