手風琴摘要API

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

範例

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

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

閱讀這份關於最小化套件大小的指南，以瞭解差異。

原生元件的 Props 也可用。

名稱	類型	預設	描述
children	node	-	如果未設定 `src`，則用於在 AccordionSummary 內部呈現圖示或文字元素。這可以是元素，或僅僅是一個字串。
color	'danger' \| 'neutral' \| 'primary' \| 'success' \| 'warning'	'neutral'	元件的顏色。它支援適用於此元件的這些主題顏色。若要瞭解如何新增自己的顏色，請查看主題元件—擴充顏色。
component	elementType	-	用於根節點的元件。可以是字串（用於 HTML 元素）或元件。
indicator	node	<KeyboardArrowDown />	要顯示的指示器元素。
slotProps	{ button?: func \| object, indicator?: func \| object, root?: func \| object }	{}	用於內部每個 slot 的 props。
slots	{ button?: elementType, indicator?: elementType, root?: elementType }	{}	用於內部每個 slot 的元件。請參閱下方的Slots API 以取得更多詳細資訊。
sx	Array<func \| object \| bool> \| func \| object	-	允許定義系統覆寫以及額外 CSS 樣式的系統 prop。請參閱 `sx` 頁面以取得更多詳細資訊。
variant	'outlined' \| 'plain' \| 'soft' \| 'solid'	'plain'	要使用的全域 variant。若要瞭解如何新增自己的 variants，請查看主題元件—擴充 variants。

ref 會轉發到根元素。

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

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

Slot 名稱	類別名稱	預設元件	描述
root	.MuiAccordionSummary-root	`'div'`	呈現 root 的元件。
button	.MuiAccordionSummary-button	`'button'`	呈現 button 的元件。
indicator	.MuiAccordionSummary-indicator	`'span'`	呈現 indicator 的元件。

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

類別名稱	規則名稱	描述
.Mui-disabled		當手風琴停用時套用的類別名稱。
.Mui-expanded		當手風琴展開時套用的類別名稱。

您可以使用以下其中一種客製化選項來覆寫元件的樣式

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