React Semantic-ui如何使用附加参数处理dropdown onclick

Question

我正在使用react semantic ui dropdown，并希望在我的dropdown上处理onclick事件。考虑到我有这个方法要处理

handleClick = (e, {value }) => this.setState({id: value })

然后我就可以用这个打电话了

 <Dropdown
     selection
     options={myOptions}
     placeholder='I change value on keyboard navigation'
     onClick={this.handleClick} />

但在某些情况下，我想使用额外的参数调用handleClick，我尝试过这样做

<Dropdown
     selection
     options={myOptions}
     placeholder='I change value on keyboard navigation'
     onClick={this.handleClick.bind(this,idx)} />

并将我的处理程序更改为handleClick = (e, {value },idx) => this.setState({id: value })，但它似乎不起作用。我做错了什么或有什么建议吗？

Answer 1

我认为这部分不是这样执行的

onClick={this.handleClick.bind(this,idx)}

它应该改成这样

onClick={(idx) => this.handleClick.bind(this,idx)}

在React中，当我们必须在单击时传递带函数的参数时，我们必须像上面那样添加箭头符号。如果这个帮助对你不起作用，那么我认为你必须改变你的绑定，然后下面的代码将会帮助你

将onClick={this.handleClick.bind(this,idx)}更改为以下内容

onClick={(e, e.target.value, idx) => this.handleClick(e, e.target.value, idx)}

同时也改变了

handleClick = (e, {value },idx) => this.setState({id: value })

到这个

handleClick = (e, value, idx) => this.setState({id: value })