AccordionSummaryAPI

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

範例

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

import AccordionSummary from '@mui/material/AccordionSummary';
// or
import { AccordionSummary } from '@mui/material';

ButtonBase 元件的 props 也可使用。

名稱	類型	預設值	描述
children	node	-	元件的內容。
classes	object	-	覆寫或擴充套用至元件的樣式。如需更多詳細資訊，請參閱下方的CSS 類別 API。
expandIcon	node	-	要顯示為展開指示器的圖示。
focusVisibleClassName	string	-	此 prop 可以協助識別哪個元素具有鍵盤焦點。當元素透過鍵盤互動取得焦點時，將會套用類別名稱。這是 CSS :focus-visible 選取器的 polyfill。使用此功能的理由在此處說明。如果需要，可以使用 polyfill 將 `focus-visible` 類別套用至其他元件。
slotProps	{ content?: func \| object, expandIconWrapper?: func \| object, root?: func \| object }	{}	用於每個內部插槽的 props。
slots	{ content?: elementType, expandIconWrapper?: elementType, root?: elementType }	{}	用於每個內部插槽的元件。
sx	Array<func \| object \| bool> \| func \| object	-	系統 prop，允許定義系統覆寫以及其他 CSS 樣式。如需更多詳細資訊，請參閱`sx` 頁面。

ref 會轉發到根元素。

雖然上面未明確記載，但 ButtonBase 元件的 props 也可在 AccordionSummary 中使用。您可以利用此優勢來鎖定巢狀元件。

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

插槽名稱	類別名稱	預設元件	描述
root	.MuiAccordionSummary-root	`ButtonBase`	呈現 root 插槽的元件。
content	.MuiAccordionSummary-content	`div`	呈現 content 插槽的元件。
expandIconWrapper	.MuiAccordionSummary-expandIconWrapper	`div`	呈現 expand icon wrapper 插槽的元件。

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

類別名稱	規則名稱	描述
.Mui-disabled		如果 `disabled={true}`，則套用至根元素的狀態類別。
.Mui-expanded		如果 `expanded={true}`，則套用至根元素、children wrapper 元素和 `IconButton` 元件的狀態類別。
.Mui-focusVisible		如果按鈕具有鍵盤焦點，則套用至 ButtonBase 根元素的狀態類別。
.MuiAccordionSummary-contentGutters	contentGutters	除非 `disableGutters={true}`，否則套用至 children wrapper 元素的樣式。已過時－改為合併 .MuiAccordionSummary-gutters 和 .MuiAccordionSummary-content 類別。如需更多詳細資訊，請參閱從已過時 API 移轉。
.MuiAccordionSummary-gutters	gutters	除非 `disableGutters={true}`，否則套用至根元素的樣式。

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

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