منو (Menu)
منوها به کاربران این امکان را میدهند که یک آیتم را از گروهی از گزینههای موجود انتخاب کنند.
ساده (Simple)
مثال سادهای از منو.
آیتم منوی قابل گسترش (Collapsable menu item)
منوها میتوانند شامل سطوح تو در تو به عنوان آیتمهای منوی قابل گسترش باشند.
گروه منو (Menu group)
منوها میتوانند آیتمهای منو را به گروههای مختلف تقسیم کنند.
با آیکون (With icon)
مثال منویی با آیکون در آیتمهای منو.
آیتم منوی غیرفعال (Disabled menu item)
آیتمهای منو میتوانند غیرفعال شوند تا از تعامل کاربر با آنها جلوگیری شود.
فعال پیشفرض (Default active)
ما میتوانیم آیتمهای منو را با وارد کردن
eventKey مربوطه در defaultActiveKeys فعال کنیم.گسترش پیشفرض (Default expand)
ما میتوانیم آیتمهای منوی قابل گسترش را با وارد کردن
eventKey مربوطه در defaultExpandedKeys گسترش دهیم.API
منو (Menu)
| ویژگی | توضیحات | نوع | پیشفرض |
|---|---|---|---|
| defaultActiveKeys | آیتم منوی پیشفرض به عنوان فعال بر اساس کلیدهای وارد شده که به eventkey مربوط میشوند. | string[] | [] |
| defaultCollapseActiveKeys | آیتم منوی قابل گسترش پیشفرض فعال بر اساس کلیدهای وارد شده که به eventkey مربوط میشوند. | string[] | [] |
| defaultExpandedKeys | آیتم منوی قابل گسترش پیشفرض بر اساس کلیدهای وارد شده که به eventkey مربوط میشوند. | string[] | [] |
| menuItemHeight | ارتفاع تمام آیتمهای منو | string | number | 40 |
| onSelect | بازخورد زمانی که آیتم منو انتخاب میشود | (e: MouseEvent, eventKey: string) => void | - |
| sideCollapsed | آیا منو به صورت جانبی فشرده شود؟ | boolean | false |
| variant | نوعهای مختلف منو. | 'light' | 'dark' | 'themed' | 'transparent' | 'light' |
گسترش منو (Menu.MenuCollapse)
| ویژگی | توضیحات | نوع | پیشفرض |
|---|---|---|---|
| active | آیا آیتم منوی قابل گسترش برجسته شود؟ | boolean | true |
| eventKey | مقدار منحصر به فرد برای آیتم منوی قابل گسترش | string | - |
| expanded | آیا آیتم منوی قابل گسترش فعلی گسترش یابد؟ | boolean | false |
| indent | آیا باید آیتمهای فرزند منو تو رفتگی داشته باشند؟ | boolean | true |
| label | محتوای آیتم منوی قابل گسترش | string | ReactNode | - |
| onToggle | بازخورد زمانی که آیتم منوی قابل گسترش تغییر وضعیت میدهد | (expanded: boolean, e: MouseEvent) => void | - |
گروه منو (Menu.MenuGroup)
| ویژگی | توضیحات | نوع | پیشفرض |
|---|---|---|---|
| label | محتوای عنوان گروه منوی قابل گسترش | string | ReactNode | - |
آیتم منو (Menu.MenuItem)
| ویژگی | توضیحات | نوع | پیشفرض |
|---|---|---|---|
| asElement | عنصر رندر شده | string | 'div' |
| disabled | آیا آیتم منو غیرفعال باشد؟ | boolean | - |
| dotIndent | آیا نقطه به عنوان پیشوند در آیتم منو نمایش داده شود؟ | boolean | - |
| eventKey | مقدار منحصر به فرد برای آیتم منو | boolean | - |
| isActive | آیا آیتم منو فعال باشد؟ | boolean | - |
| menuItemHeight | ارتفاع آیتم منو | string | number | 40 |
| onSelect | بازخورد زمانی که آیتم منو انتخاب میشود | (eventKey: string, e: MouseEvent) => void | 40 |