为什么 onClick 不能直接在我的自定义元素上工作,如此处所示?函数 selectedResource 不会被调用。
return (
<div>
{
resources.map(resource => {
return (
<SelectListItem key={resource.id} onClick={this.chosenResource.bind(this)} resource={resource} />
)
})
}
</div>
)
但是,如果我将自定义元素封装在 div 元素中,并在 div 元素上添加 onClick,那么它就可以工作。
return (
<div>
{
resources.map(resource => {
return (
<div key={resource.id} onClick={this.chosenResource.bind(this)}>
<SelectListItem resource={resource} />
</div>
)
})
}
</div>
)
第一种方法有什么问题?
最佳答案
@nrgwsth 是正确的,如果您仍然想坚持第一种方法,您可以使用:
return (
<div>
{
resources.map(resource => {
return (
<SelectListItem key={resource.id} customClickEvent={this.chosenResource.bind(this)} resource={resource} />
)
})
}
</div>
)
然后,在 SelectListItem 的 render()
函数中,像这样使用:
return (
<div onClick={this.props.customClickEvent}>
...
</div>
)
关于reactjs - onClick 不适用于自定义组件,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/45727171/