在 Ant Design 组件库中,Dropdown 组件提供了 onSelect
和 onClick
两个回调函数,可以用于处理点击事件。
onSelect
回调函数在 Dropdown 子菜单项被选择时触发,而 onClick
回调函数则在 Dropdown 菜单被点击时触发。
以下是一个使用 onClick
回调函数处理点击事件的示例:
import { Dropdown, Button } from 'antd'; const { Menu } = Dropdown; function handleClick(e) { console.log('Dropdown clicked:', e); } const App = () => ( <Dropdown onClick={handleClick}> <a>Click me</a> <Menu> <Menu.Item>Option 1</Menu.Item> <Menu.Item>Option 2</Menu.Item> <Menu.Item>Option 3</Menu.Item> </Menu> </Dropdown> ); export default App;
在这个示例中,我们定义了一个名为 handleClick
的回调函数,用于处理 Dropdown 菜单的点击事件。在 Dropdown
组件上设置 onClick={handleClick}
将该回调函数绑定到菜单的点击事件上。当用户点击 Dropdown 菜单时,handleClick
函数将被调用,同时传入一个包含事件信息的对象作为参数。在这个例子中,我们简单地将点击事件的信息打印到控制台上。