跳到內容

PickersTextFieldAPI

React PickersTextField 組件的 API 參考文檔。了解此導出模組的 props、CSS 和其他 API。

示範

導入

import { PickersTextField } from '@mui/x-date-pickers/PickersTextField';
// or
import { PickersTextField } from '@mui/x-date-pickers';
// or
import { PickersTextField } from '@mui/x-date-pickers-pro';

通過閱讀這份關於最小化捆綁包大小的指南，了解它們之間的區別。

Props

名稱類型預設描述
areAllSectionsEmpty*bool-

如果當前值等於空值，則為 true。對於單個項目值，這表示 value === null。對於範圍值，這表示 value === [null, null]

contentEditable*bool-

如果為 true，則整個元素可編輯。當所有區段都被選中時很有用。

elements*Array<{ after: object, before: object, container: object, content: object }>-

要渲染的元素。每個元素都包含用於編輯值區段的 prop。

color'error'
| 'info'
| 'primary'
| 'secondary'
| 'success'
| 'warning'		'primary'

組件的顏色。它支持預設和自訂主題顏色，可以按照調色盤自訂指南中所示的方式添加。

focusedbool-

如果為 true，則組件以焦點狀態顯示。

helperTextnode-

輔助文字內容。

hiddenLabelboolfalse

如果為 true，則標籤會被隱藏。這用於增加 FilledInput 的密度。請務必將 aria-label 添加到 input 元素。

InputPropsobject-

應用於 Input 元素的 Props。它將是 FilledInput、OutlinedInput 或 Input 組件，具體取決於 variant prop 值。

margin'dense'
| 'none'
| 'normal'		'none'

如果為 dense 或 normal，將調整此組件和包含的組件的垂直間距。

requiredboolfalse

如果為 true，則標籤將指示 input 是必填項。

size'medium'
| 'small'		'medium'

組件的大小。

sxArray<func
| object
| bool>
| func
| object		-

系統 prop，允許定義系統覆蓋以及額外的 CSS 樣式。

有關更多詳細資訊，請參閱 `sx` 頁面。

variant'filled'
| 'outlined'
| 'standard'		'outlined'

要使用的變體。

組件不能持有 ref。

CSS 類別

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

類別名稱規則名稱描述
.MuiPickersTextField-fullWidthfullWidth如果 fullWidth={true}，則應用於根元素的樣式。
.MuiPickersTextField-marginDensemarginDense如果 margin="dense"，則應用於根元素的樣式。
.MuiPickersTextField-marginNormalmarginNormal如果 margin="normal"，則應用於根元素的樣式。
.MuiPickersTextField-rootroot應用於根元素的樣式。

您可以使用以下自訂選項之一覆蓋組件的樣式

原始碼

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