跳到主要內容
跳到主要內容
🚀 影響 Toolpad Core 2025 年的產品藍圖！參與最新的開發者問卷調查

SignOutButtonAPI

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

範例

匯入

import { SignOutButton } from '@toolpad/core/Account';

Props

名稱類型描述
childrennode

元件的內容。

此元件無法持有 ref。

CSS 類別

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

類別名稱規則名稱描述
.colorError如果 color="error"，則樣式會應用於根元素。
.colorInfo如果 color="info"，則樣式會應用於根元素。
.colorInherit如果 color="inherit"，則樣式會應用於根元素。
.colorPrimary如果 color="primary"，則樣式會應用於根元素。
.colorSecondary如果 color="secondary"，則樣式會應用於根元素。
.colorSuccess如果 color="success"，則樣式會應用於根元素。
.colorWarning如果 color="warning"，則樣式會應用於根元素。
.contained如果 variant="contained"，則樣式會應用於根元素。
.containedError如果 variant="contained" 且 color="error"，則樣式會應用於根元素。
.containedInfo如果 variant="contained" 且 color="info"，則樣式會應用於根元素。
.containedInherit如果 variant="contained" 且 color="inherit"，則樣式會應用於根元素。
.containedPrimary如果 variant="contained" 且 color="primary"，則樣式會應用於根元素。
.containedSecondary如果 variant="contained" 且 color="secondary"，則樣式會應用於根元素。
.containedSizeLarge如果 size="large" 且 variant="contained"，則樣式會應用於根元素。
.containedSizeMedium如果 size="medium" 且 variant="contained"，則樣式會應用於根元素。
.containedSizeSmall如果 size="small" 且 variant="contained"，則樣式會應用於根元素。
.containedSuccess如果 variant="contained" 且 color="success"，則樣式會應用於根元素。
.containedWarning如果 variant="contained" 且 color="warning"，則樣式會應用於根元素。
.disabled如果 disabled={true}，則狀態類別會應用於根元素。
.disableElevation如果 disableElevation={true}，則樣式會應用於根元素。
.endIcon如果提供，樣式會應用於 endIcon 元素。
.focusVisible如果按鈕具有鍵盤焦點，則狀態類別會應用於 ButtonBase 根元素。
.fullWidth如果 fullWidth={true}，則樣式會應用於根元素。
.icon如果提供，樣式會應用於 icon 元素
.iconSizeLarge如果提供且 size="large"，則樣式會應用於 icon 元素。
.iconSizeMedium如果提供且 size="medium"，則樣式會應用於 icon 元素。
.iconSizeSmall如果提供且 size="small"，則樣式會應用於 icon 元素。
.loading如果 loading={true}，則樣式會應用於根元素。
.loadingIconPlaceholder樣式會應用於 loadingIconPlaceholder 元素。
.loadingIndicator樣式會應用於 loadingIndicator 元素。
.loadingPositionCenter如果 loadingPosition="center"，則樣式會應用於根元素。
.loadingPositionEnd如果 loadingPosition="end"，則樣式會應用於根元素。
.loadingPositionStart如果 loadingPosition="start"，則樣式會應用於根元素。
.loadingWrapper樣式會應用於 loadingWrapper 元素。
.outlined如果 variant="outlined"，則樣式會應用於根元素。
.outlinedError如果 variant="outlined" 且 color="error"，則樣式會應用於根元素。
.outlinedInfo如果 variant="outlined" 且 color="info"，則樣式會應用於根元素。
.outlinedInherit如果 variant="outlined" 且 color="inherit"，則樣式會應用於根元素。
.outlinedPrimary如果 variant="outlined" 且 color="primary"，則樣式會應用於根元素。
.outlinedSecondary如果 variant="outlined" 且 color="secondary"，則樣式會應用於根元素。
.outlinedSizeLarge如果 size="large" 且 variant="outlined"，則樣式會應用於根元素。
.outlinedSizeMedium如果 size="medium" 且 variant="outlined"，則樣式會應用於根元素。
.outlinedSizeSmall如果 size="small" 且 variant="outlined"，則樣式會應用於根元素。
.outlinedSuccess如果 variant="outlined" 且 color="success"，則樣式會應用於根元素。
.outlinedWarning如果 variant="outlined" 且 color="warning"，則樣式會應用於根元素。
.root樣式會應用於根元素。
.sizeLarge如果 size="large"，則樣式會應用於根元素。
.sizeMedium如果 size="medium"，則樣式會應用於根元素。
.sizeSmall如果 size="small"，則樣式會應用於根元素。
.startIcon如果提供，樣式會應用於 startIcon 元素。
.text如果 variant="text"，則樣式會應用於根元素。
.textError如果 variant="text" 且 color="error"，則樣式會應用於根元素。
.textInfo如果 variant="text" 且 color="info"，則樣式會應用於根元素。
.textInherit如果 variant="text" 且 color="inherit"，則樣式會應用於根元素。
.textPrimary如果 variant="text" 且 color="primary"，則樣式會應用於根元素。
.textSecondary如果 variant="text" 且 color="secondary"，則樣式會應用於根元素。
.textSizeLarge如果 size="large" 且 variant="text"，則樣式會應用於根元素。
.textSizeMedium如果 size="medium" 且 variant="text"，則樣式會應用於根元素。
.textSizeSmall如果 size="small" 且 variant="text"，則樣式會應用於根元素。
.textSuccess如果 variant="text" 且 color="success"，則樣式會應用於根元素。
.textWarning如果 variant="text" 且 color="warning"，則樣式會應用於根元素。

您可以使用以下自訂選項之一來覆寫元件的樣式

  • 使用全域類別名稱。
  • 在自訂主題中使用規則名稱作為元件的 styleOverrides 屬性的一部分。

原始碼

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