TabListAPI
React TabList 元件的 API 參考文件。瞭解此匯出模組的 props、CSS 和其他 API。
範例
Import
import TabList from '@mui/lab/TabList';
// or
import { TabList } from '@mui/lab';閱讀關於最小化 bundle 大小的指南，以瞭解差異。
Tabs 元件的 Props 也可使用。
| 名稱 | 類型 | 描述 |
|---|---|---|
| children | node |
|
ref 會轉發到根元素。繼承
雖然上面沒有明確的文件說明，但 Tabs 元件的 props 也可在 TabList 中使用。您可以利用這一點來鎖定巢狀元件。
這些類別名稱對於使用 CSS 設定樣式很有用。當觸發特定狀態時，它們會套用至元件的插槽。
| 類別名稱 | 規則名稱 | 描述 |
|---|---|---|
| .MuiTabList-centered | centered | 如果 centered={true} & !variant="scrollable"，則樣式會套用至彈性容器元素。 |
| .MuiTabList-fixed | fixed | 如果 !variant="scrollable"，則樣式會套用至 tablist 元素。 |
| .MuiTabList-flexContainer | flexContainer | |
| .MuiTabList-flexContainerVertical | flexContainerVertical | |
| .MuiTabList-hideScrollbar | hideScrollbar | 如果 variant="scrollable" 且 visibleScrollbar={false}，則樣式會套用至 tablist 元素。 |
| .MuiTabList-indicator | indicator | 套用至 TabIndicator 元件的樣式。 |
| .MuiTabList-list | list | 套用至 list 元素的樣式。 |
| .MuiTabList-root | root | 套用至根元素的樣式。 |
| .MuiTabList-scrollableX | scrollableX | 如果 variant="scrollable" 且 orientation="horizontal"，則樣式會套用至 tablist 元素。 |
| .MuiTabList-scrollableY | scrollableY | 如果 variant="scrollable" 且 orientation="vertical"，則樣式會套用至 tablist 元素。 |
| .MuiTabList-scrollButtons | scrollButtons | 套用至 ScrollButtonComponent 元件的樣式。 |
| .MuiTabList-scrollButtonsHideMobile | scrollButtonsHideMobile | 如果 allowScrollButtonsMobile={true}，則樣式會套用至 ScrollButtonComponent 元件。 |
| .MuiTabList-scroller | scroller | 套用至 tablist 元素的樣式。 |
| .MuiTabList-vertical | vertical | 如果 orientation="vertical"，則樣式會套用至根元素。 |
您可以使用下列自訂選項之一覆寫元件的樣式
- 使用全域類別名稱。
- 在自訂主題中使用規則名稱作為元件
styleOverrides屬性的一部分。
原始碼
如果您在此頁面中找不到資訊，請考慮查看元件的實作以瞭解更多詳細資訊。