ant-design/components/dropdown/demo/extra.tsx
ice eac5b6893d
feat(menu): support extra prop (#50431)
* feat(dropdown): support extra prop

* text: fix items

* Update components/menu/style/index.ts

Co-authored-by: lijianan <574980606@qq.com>
Signed-off-by: ice <49827327+coding-ice@users.noreply.github.com>

* Update package.json

Co-authored-by: lijianan <574980606@qq.com>
Signed-off-by: ice <49827327+coding-ice@users.noreply.github.com>

* style: css

* chore: bump rc-menu from 9.15.1 to 9.15.0

* style: classname

* test: clsname

* chore: rc-menu to ^9.15.1

* chore: rc-menu version from ^ to ~

* chore: update deps

* feat: full width

* fix: children is array

* fix: default array

* fix: label

* test: update snap

* test: case

---------

Signed-off-by: ice <49827327+coding-ice@users.noreply.github.com>
Co-authored-by: lijianan <574980606@qq.com>
2024-09-03 07:15:18 +08:00

45 lines
758 B
TypeScript

import React from 'react';
import { DownOutlined, SettingOutlined } from '@ant-design/icons';
import type { MenuProps } from 'antd';
import { Dropdown, Space } from 'antd';
const items: MenuProps['items'] = [
{
key: '1',
label: 'My Account',
disabled: true,
},
{
type: 'divider',
},
{
key: '2',
label: 'Profile',
extra: '⌘P',
},
{
key: '3',
label: 'Billing',
extra: '⌘B',
},
{
key: '4',
label: 'Settings',
icon: <SettingOutlined />,
extra: '⌘S',
},
];
const App: React.FC = () => (
<Dropdown menu={{ items }}>
<a onClick={(e) => e.preventDefault()}>
<Space>
Hover me
<DownOutlined />
</Space>
</a>
</Dropdown>
);
export default App;