ImageListItemBarAPI
React ImageListItemBar 元件的 API 參考文件。瞭解此匯出模組的 props、CSS 和其他 API。
範例展示
匯入
import ImageListItemBar from '@mui/material/ImageListItemBar';
// or
import { ImageListItemBar } from '@mui/material';閱讀這份關於最小化 bundle 大小的指南，以瞭解差異。
原生元件的 Props 也可使用。
| 名稱 | 類型 | 預設 | 描述 |
|---|---|---|---|
| actionIcon | node | - | 作為輔助操作目標 (主要操作目標為項目本身) 使用的 IconButton 元素。 |
| actionPosition | 'left' | 'right' | 'right' | 輔助操作 IconButton 的位置。 |
| classes | object | - | 覆寫或擴充套用至元件的樣式。 請參閱下方的 CSS 類別 API 以瞭解更多詳細資訊。 |
| position | 'below' | 'bottom' | 'top' | 'bottom' | 標題列的位置。 |
| subtitle | node | - | 作為副標題 (支援文字) 的字串或元素。 |
| sx | Array<func | object | bool> | func | object | - | 允許定義系統覆寫以及額外 CSS 樣式的系統 prop。 請參閱 `sx` 頁面 以瞭解更多詳細資訊。 |
| title | node | - | 要顯示的標題。 |
ref 已轉發至根元素。主題預設 props
您可以使用 MuiImageListItemBar 透過主題變更此元件的預設 props。
這些類別名稱對於使用 CSS 設定樣式很有用。它們在觸發特定狀態時套用至元件的插槽。
| 類別名稱 | 規則名稱 | 描述 |
|---|---|---|
| .MuiImageListItemBar-actionIcon | actionIcon | 如果提供，則套用至 actionIcon 的樣式。 |
| .MuiImageListItemBar-actionIconActionPosLeft | actionIconActionPosLeft | 如果 actionPosition="left"，則套用至 actionIcon 的樣式。 |
| .MuiImageListItemBar-actionPositionLeft | actionPositionLeft | 如果 actionPosition="left"，則套用至操作容器元素的樣式。 |
| .MuiImageListItemBar-actionPositionRight | actionPositionRight | 如果 actionPosition="right"，則套用至操作容器元素的樣式。 |
| .MuiImageListItemBar-positionBelow | positionBelow | 如果 position="below"，則套用至根元素的樣式。 |
| .MuiImageListItemBar-positionBottom | positionBottom | 如果 position="bottom"，則套用至根元素的樣式。 |
| .MuiImageListItemBar-positionTop | positionTop | 如果 position="top"，則套用至根元素的樣式。 |
| .MuiImageListItemBar-root | root | 套用至根元素的樣式。 |
| .MuiImageListItemBar-subtitle | subtitle | 套用至副標題容器元素的樣式。 |
| .MuiImageListItemBar-title | title | 套用至標題容器元素的樣式。 |
| .MuiImageListItemBar-titleWrap | titleWrap | 套用至標題和副標題容器元素的樣式。 |
| .MuiImageListItemBar-titleWrapActionPosLeft | titleWrapActionPosLeft | 如果 actionPosition="left"，則套用至容器元素的樣式。 |
| .MuiImageListItemBar-titleWrapActionPosRight | titleWrapActionPosRight | 如果 actionPosition="right"，則套用至容器元素的樣式。 |
| .MuiImageListItemBar-titleWrapBelow | titleWrapBelow | 如果 position="below"，則套用至標題和副標題容器元素的樣式。 |
您可以使用以下自訂選項之一覆寫元件的樣式
- 使用全域類別名稱。
- 在自訂主題中使用規則名稱作為元件的
styleOverrides屬性的一部分。
原始碼
如果您在此頁面中找不到資訊，請考慮查看元件的實作以瞭解更多詳細資訊。