antdesign 下拉菜单

Ant Design 是一个流行的 React UI 组件库，它提供了许多现成的组件，包括下拉菜单。Ant Design 的下拉菜单组件非常灵活，可以根据不同的需求进行定制。

使用 Ant Design 的下拉菜单组件非常简单，只需在你的 React 项目中引入组件，然后在代码中使用即可。下面是一个简单的示例代码：

import { Menu, Dropdown, Button } from 'antd';
import { DownOutlined } from '@ant-design/icons';

const menu = (
  <Menu>
    <Menu.Item key="1">菜单项1</Menu.Item>
    <Menu.Item key="2">菜单项2</Menu.Item>
    <Menu.Item key="3">菜单项3</Menu.Item>
  </Menu>
);

const DropdownButton = () => {
  return (
    <Dropdown overlay={menu}>
      <Button>
        下拉菜单 <DownOutlined />
      </Button>
    </Dropdown>
  );
};

export default DropdownButton;

在这个例子中，我们首先引入了 `Menu`、`Dropdown` 和 `Button` 组件，以及 `DownOutlined` 图标。然后，我们定义了一个 `menu` 变量，它包含了三个菜单项。最后，我们使用 `Dropdown` 组件将 `menu` 组件作为下拉菜单的内容，并将其包裹在 `Button` 组件中。

Ant Design 的下拉菜单组件还支持许多其他的属性和配置项，例如可以通过 `trigger` 属性来指定触发下拉菜单的事件，默认是鼠标点击。你可以查看 Ant Design 的官方文档以获取更详细的信息。