Ant Select 关闭下拉菜单
问题描述:
我在 Dropdown 组件中使用 Ant Select 组件.这是我的索引文件,它呈现下拉
I am using Ant Select component inside Dropdown component. Here is my index file which renders Dropdown
const getMenu = filter => (
<MenuContainer
...
/>
);
<Dropdown
overlay={getMenu(searchFilter)}
trigger={['click']}
visible={this.state.search}
onVisibleChange={val =>
this.handleDropdownVisibility(val, searchFilter)
}
>
...
</Dropdown>
这是我的 MenuContainer,它返回里面的 Select Component
Here is my MenuContainer which return Select Component inside it
handleSelectChange = val => {
this.setState({
selectedValue: val,
});
};
<Select
ref="selectBox"
onChange={this.handleSelectChange}
style={{ width: '100%' }}
>
{numberComparision.map((item, i) => {
return (
<Option key={i} value={item.id}>
{item.name}
</Option>
);
})}
</select>
所以点击选择值 onVisibleChange 触发并关闭下拉列表
so on clicking select value onVisibleChange fires and closes dropdown
答
Change Menu.Item 其中选择包含到 Menu.ItemGroup 中,单击时不会触发 onVisibleChange.
Change Menu.Item where the select is contained to a Menu.ItemGroup, those do not trigger the onVisibleChange when clicked.