StepIconAPI

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

範例

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

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

SvgIcon 元件的 props 也可使用。

名稱	類型	預設值	描述
active	bool	false	此步驟是否為作用中。
classes	object	-	覆寫或擴充套用至元件的樣式。請參閱下方CSS 類別 API 以瞭解更多詳細資訊。
completed	bool	false	將步驟標記為已完成。會傳遞至子元件。
error	bool	false	若為 `true`，步驟會標記為失敗。
icon	node	-	步驟圖示中顯示的標籤。
sx	Array<func \| object \| bool> \| func \| object	-	系統 prop，允許定義系統覆寫以及額外的 CSS 樣式。請參閱 `sx` 頁面以瞭解更多詳細資訊。

ref 會轉發到根元素。

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

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

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

類別名稱	規則名稱	描述
.Mui-active		如果 `active={true}`，則套用至根元素的狀態類別。
.Mui-completed		如果 `completed={true}`，則套用至根元素的狀態類別。
.Mui-error		如果 `error={true}`，則套用至根元素的狀態類別。
.MuiStepIcon-root	root	套用至根元素的樣式。
.MuiStepIcon-text	text	套用至 SVG 文字元素的樣式。

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

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