跳到内容

PickersTextFieldAPI

React PickersTextField 组件的 API 参考文档。了解此导出模块的属性、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';

通过阅读关于最小化 bundle size 的指南，了解它们之间的区别。

属性

名称类型默认值描述
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 元素的属性。根据 variant 属性值，它将是 FilledInput、OutlinedInput 或 Input 组件。

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

如果为 dense 或 normal，将调整此组件和包含组件的垂直间距。

requiredboolfalse

如果为 true，标签将指示 input 是必需的。

size'medium'
| 'small'		'medium'

组件的尺寸。

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

允许定义系统覆盖以及其他 CSS 样式的系统属性。

有关更多详细信息，请参阅 `sx` 页面。

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

要使用的 variant。

该组件不能持有 ref。

CSS 类

这些类名对于使用 CSS 进行样式设置很有用。当特定状态被触发时，它们会被应用到组件的插槽。

类名规则名称描述
.MuiPickersTextField-fullWidthfullWidth如果 fullWidth={true}，则应用于根元素的样式。
.MuiPickersTextField-marginDensemarginDense如果 margin="dense"，则应用于根元素的样式。
.MuiPickersTextField-marginNormalmarginNormal如果 margin="normal"，则应用于根元素的样式。
.MuiPickersTextField-rootroot应用于根元素的样式。

您可以使用以下自定义选项之一来覆盖组件的样式

源代码

如果您在此页面中没有找到所需信息，请考虑查看组件的实现以获取更多详细信息。