MenuItemAPI

React MenuItem 元件的 API 參考文件。了解此匯出模組的 props、CSS 和其他 API。

示範

如需此 React 元件的使用範例和詳細資訊，請造訪元件示範頁面

import MenuItem from '@mui/joy/MenuItem';
// or
import { MenuItem } from '@mui/joy';

名稱	類型	描述
children	node	元件的內容。

ref 會轉發到根元素。

雖然以上未明確記載，但 ListItemButton 元件的 props 也可在 MenuItem 中使用。您可以利用此功能來指定巢狀元件。

您可以使用 JoyMenuItem 來透過主題變更此元件的預設 props。

若要了解如何自訂插槽，請查看覆寫元件結構指南。

插槽名稱	類別名稱	預設元件	描述
root	.MuiMenuItem-root	`'div'`	呈現根的元件。

這些類別名稱可用於使用 CSS 設定樣式。當觸發特定狀態時，它們會套用至元件的插槽。

類別名稱	規則名稱	描述
.Mui-disabled		如果 `disabled={true}`，則套用至內部 `component` 元素的狀態類別。
.Mui-focusVisible		套用至 `component` 的 `focusVisibleClassName` prop 的狀態類別。
.Mui-selected		如果 `selected={true}`，則套用至根元素的狀態類別。
.MuiMenuItem-colorContext	colorContext	當觸發顏色反轉時，套用至根元素的類別名稱。
.MuiMenuItem-colorDanger	colorDanger	如果 `color="danger"`，則套用至根元素的類別名稱。
.MuiMenuItem-colorNeutral	colorNeutral	如果 `color="neutral"`，則套用至根元素的類別名稱。
.MuiMenuItem-colorPrimary	colorPrimary	如果 `color="primary"`，則套用至根元素的類別名稱。
.MuiMenuItem-colorSuccess	colorSuccess	如果 `color="success"`，則套用至根元素的類別名稱。
.MuiMenuItem-colorWarning	colorWarning	如果 `color="warning"`，則套用至根元素的類別名稱。
.MuiMenuItem-variantOutlined	variantOutlined	如果 `variant="outlined"`，則套用至根元素的狀態類別。
.MuiMenuItem-variantPlain	variantPlain	如果 `variant="plain"`，則套用至根元素的狀態類別。
.MuiMenuItem-variantSoft	variantSoft	如果 `variant="soft"`，則套用至根元素的狀態類別。
.MuiMenuItem-variantSolid	variantSolid	如果 `variant="solid"`，則套用至根元素的狀態類別。

您可以使用下列其中一種自訂選項來覆寫元件的樣式

如果您在此頁面中找不到資訊，請考慮查看元件的實作以取得更多詳細資訊。