ImageField Upload Image

When to Use

• Used for uploading image materials and submitting scenarios;

Component Example

Component Properties

属性	说明	类型	默认值
accept	Set upload image type (multiple separated by comma ,)	string	'image/*'
autoUpload	Whether to auto upload, after disabling, need to manually call this.$('fieldId').startUpload() to start upload	boolean	true
beforeUpload	Upload before processing event	(file: object, options: object) => void	-
behavior	表单组件显示状态	Behavior	'NORMAL'
buttonSize	Upload button size	'small' | 'medium' | 'large'	'medium'
buttonText	Set button content, only effective on PC	string	'Upload File'
buttonType	Upload button type	'primary' | 'secondary' | 'normal'	'primary'
customUploadPane	Custom panel	() => ReactNode	-
data	Set additional parameters that can be attached during upload	object	{}
formatter	Data processing event	(response: any) => any	-
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'
limit	Set maximum number of uploaded files	number	9
maxFileSize	Set maximum upload size for single file (MB)	number	50
multiple	Whether to support uploading multiple images	boolean	true
name	Name sent to the server during upload	string	-
normalListType	Set list style	'text' | 'image'	'image'
onCancel	Component value click to cancel upload event	() => void	-
onChange	Component value change event	({ value: object }) => void	-
onDragLeave	Component value drag leave event	() => void	-
onDragOver	Component value drag over event	() => void	-
onDrop	Component value drag drop event	() => void	-
onError	Component value upload failure event	(file: object, value: array) => void	-
onProgress	Component uploading event	() => void	-
onRemove	Component value click to remove event	(file: object) => void	-
onSelect	Component value selection event	(file: object) => void	-
onSuccess	Component value upload success event	(file: object, value: array) => void	-
onlyCameraUpload	Only allow camera upload, this feature currently only supports DingTalk mobile, after enabling, "non-DingTalk mobile" will automatically disable the upload function.	boolean	false
size	表单组件尺寸	Size	'medium'
timeout	Set upload timeout, unit in ms	number	0
tips	表单组件描述信息，展示在控件下方	string	-
type	Set upload type, only effective on PC	'normal' | 'drag' | 'card'	'normal'
validation	表单组件校验设置，具体使用详见表单校验文档	Validation[]	[]
value	Default value	array	-
withCredentials	Set whether to allow request to carry cookie	boolean	false
wrapperColOffset	设置表单组件的偏移位置，设置值为栅格值，1代表1/24	number	0
wrapperColSpan	设置表单组件的占位宽度，设置值为栅格值，1代表1/24	number	0