TextField Input Box

When to use

• Used for text information input scenarios;

Component Example

Component Properties

属性	说明	类型	默认值
addonAfter	Input box suffix content	string	-
addonBefore	Input box prefix content	string	-
autoFocus	Whether to enable auto focus	boolean	false
autoHeight	Multi-line input box auto height, takes effect when htmlType property is textarea	boolean	false
behavior	表单组件显示状态	Behavior	'NORMAL'
hasClear	Whether to show clear button	boolean	true
hasLimitHint	Whether to show counter	boolean	false
htmlType	Set input box type, input: single line text, textarea: multi-line text, password: password	'input' | 'textarea' | 'password'	input
label	表单组件标题	string	-
labelAlign	表单组件标题的位置	'left' | 'top'	'top'
labelColOffset	设置标题的偏移位置，配置值为栅格值，1代表1/24	number	0
labelColSpan	设置标题的占位宽度，配置值为栅格值，1代表1/24	number	4
labelTextAlign	表单组件的标题对齐方式	'left' | 'right'	'right'
labelTipsIcon	表单组件标题提示信息入口图标，当labelTipsTypes取值为 text 或 render 时生效	string	-
labelTipsRender	表单组件标题提示信息自定义渲染方法，当labelTipsTypes取值为 render 时生效	(props: IComponentProps) => ReactNode	-
labelTipsText	表单组件标题提示文本信息，当labelTipsTypes取值为 text 时生效	string	-
labelTipsTypes	表单组件标题提示信息类型设置	LabelTipsTypes	'none'
maxLength	Set character limit	number	200
onChange	Event triggered when input box component value changes	({ value: string }) => void	-
onPressEnter	Event triggered when pressing enter key in input box	() => void	-
onScanCodeError	Event triggered after input box scan code fails	(errorMsg: string) => void	-
onScanCodeSuccess	Event triggered after input box scan code succeeds	(text: string) => void	-
placeholder	Placeholder prompt	string	'Please enter'
rows	Multi-line input box height, takes effect when htmlType property is textarea	number	4
scanCode	Whether to enable scan mode (only supported in DingTalk mobile app)	ScanCodeConfig | boolean	false
size	表单组件尺寸	Size	'medium'
state	Set input box state status	'error' | 'loading' | 'success' | ''	''
tips	表单组件描述信息，展示在控件下方	string	-
trim	Whether to automatically remove leading and trailing whitespace	boolean	false
validation	表单组件校验设置，具体使用详见表单校验文档	Validation[]	[]
validationType	Input box format	'text' | 'mobile' | 'email' | 'url' | 'chineseID' | 'password'	'text'
value	Set input box default value	string	-
wrapperColOffset	设置表单组件的偏移位置，设置值为栅格值，1代表1/24	number	0
wrapperColSpan	设置表单组件的占位宽度，设置值为栅格值，1代表1/24	number	0