blueprintjs Select 组件 onItemSelect 函数没有 运行
blueprintjs Select Component onItemSelect Function Doesn't Run
我只是想在单击下拉菜单中的 MenuItem 时向控制台输出文本。谁能发现我做错了什么?除了文档中的 example component 之外,关于此主题的帮助不大。
itemRenderer(item) {
return (
<MenuItem
key={item.id}
label={item.year}
text={item.season}
shouldDismissPopover={true}
/>
)
}
handleclick(item) {
//this never runs :(
console.log('clicked')
}
render() {
return (
<Select
items={this.state.semesters}
filterable={false}
itemRenderer={this.itemRenderer}
onItemSelect={this.handleclick}
>
<Button text={'Select a Semester'} rightIcon="caret-down" />
</Select>
)
}
您应该在每个 MenuItem
:
上添加一个点击处理程序
itemRenderer(item, {handleClick}) { // added {handleClick} argument
return (
<MenuItem
key={item.id}
label={item.year}
text={item.season}
onClick={handleClick} // added this line
shouldDismissPopover={true}
/>
)
}
检查 CodeSandbox 演示:https://codesandbox.io/s/3rplzz746m(打开控制台)
我只是想在单击下拉菜单中的 MenuItem 时向控制台输出文本。谁能发现我做错了什么?除了文档中的 example component 之外,关于此主题的帮助不大。
itemRenderer(item) {
return (
<MenuItem
key={item.id}
label={item.year}
text={item.season}
shouldDismissPopover={true}
/>
)
}
handleclick(item) {
//this never runs :(
console.log('clicked')
}
render() {
return (
<Select
items={this.state.semesters}
filterable={false}
itemRenderer={this.itemRenderer}
onItemSelect={this.handleclick}
>
<Button text={'Select a Semester'} rightIcon="caret-down" />
</Select>
)
}
您应该在每个 MenuItem
:
itemRenderer(item, {handleClick}) { // added {handleClick} argument
return (
<MenuItem
key={item.id}
label={item.year}
text={item.season}
onClick={handleClick} // added this line
shouldDismissPopover={true}
/>
)
}
检查 CodeSandbox 演示:https://codesandbox.io/s/3rplzz746m(打开控制台)