Form Components

Introduction

This article will introduce the built-in form components of Simple Admin, which can be used simply in the schema.

ApiSelect

The ApiSelect component is a commonly used component, used to obtain data from the server to achieve single selection or multiple selection.

Warning

The ApiMultipleSelect in Vben2 has been merged into ApiSelect.

Parameter	Type	Default Value	Description
numberToString	boolean	false	Whether to convert numbers to strings
api	function	null	Request method
params	Object	undefined	Request data
resultField	string	data.data	Data location
labelField	string	label	Label field
valueField	string	value	Value field
immediate	boolean	true	Whether to request immediately
alwaysLoad	boolean	false	Request each time it is used
showSearch	boolean	false	Whether to enable the search function
searchField	string		Name of the search field
multiple	boolean	false	Whether multiple selection is allowed
optionFilterProp	string	label	Filter field

ApiTreeSelect

ApiTreeSelect is a tree-shaped selection component.

Parameter	Type	Default Value	Description
numberToString	boolean	false	Whether to convert numbers to strings
api	function	null	Request method
params	Object	undefined	Request data
resultField	string	data.data	Data location
labelField	string	label	Label field
valueField	string	value	Value field
immediate	boolean	true	Whether to request immediately
showSearch	boolean	false	Whether to enable the search function
multiple	boolean	false	Whether multiple selection is allowed
treeNodeFilterProp	string	label	Filter field
idKeyField	string	id	ID field
parentKeyField	string	parentId	Parent field
childrenKeyField	string	children	Child field

DictionarySelect

DictionarySelect is a dictionary selection component.

Parameter	Type	Default Value	Description
dictionaryName	string		Dictionary name (name)
cache	boolean	false	Whether to cache

ImageUpload

ImageUpload is an image upload component.

Parameter	Type	Default Value	Description
provider	string	local	"local" is for local files, "cloud-default" is the default service provider. If it is a custom name, the corresponding cloud service provider will be used according to the name.
multiple	boolean	false	Whether multiple selection is supported
accept	array	[]	Accepted types
maxNumber	number	1	Maximum number
maxSize	number	2	Maximum size (MB)

UploadDragger

Drag and drop upload component.

Parameter	Type	Default Value	Description
multiple	boolean	false	Multiple files
provider	string	local	Provider, "local" is local, "cloud-default" is the default cloud service provider. If it is a custom name, the corresponding cloud service provider will be used according to the name.

RadioButtonGroup

Selection button.

Parameter	Type	Default Value	Description
options	Array	undefined	Option data

SimpleTimePicker

Time selection component.

Parameter	Type	Default Value	Description
timeMode	string	datetime	"datetime" is date and time, "date" is only date
valueFormat	string	unixmilli	"unixmilli" is millisecond timestamp, "unix" is second-level timestamp

SimpleRangePicker

Time range selection component.

Parameter	Type	Default Value	Description
timeMode	string	datetime	"datetime" is date and time, "date" is only date
valueFormat	string	unixmilli	"unixmilli" is millisecond timestamp, "unix" is second-level timestamp

Editor

Rich text.

Parameter	Type	Default Value	Description
uploadProvider	string	local	Provider, "local" is local, "cloud-default" is the default cloud service provider. If it is a custom name, the corresponding cloud service provider will be used according to the name.

CodeEditor

Code editing.

Parameter	Type	DefaultValue	Description
mode	string	json	Supports json and yaml