AutoComplete

Container properties

All component configurations support Container properties at the first level.

Component properties

Name	Type	Default	Supports Variable Pattern	Description
className	string		✔️	The className of the component
style	object			The style of the component
mapping	{ value: string, label: string }	{ value: 'value', label: 'label' }		The mapping relationship of value is { value, label } by default. If other keys are provided, they will be saved together.
options	{ value: string | number | boolean, label: string }			Options
dataSource	{ token: string, pbcToken: string, listUrl: string }			Data source
dataUrl	ConditionalListOrSinglePropertyPropType(string)			Get data via dataUrl.
dataUrlResolveMode	'strict' | 'loose' | 'smart'	'strict'		Controls request behavior when :variable resolution fails in dataUrl. strict: no request if any variable fails; loose: failed variables become empty strings, request proceeds; smart: path variable failure blocks request, query variable failure removes that parameter and proceeds.
dataFilters	ConditionalListPropertyPropType(DataFilters)		✔️	Fixed filter conditions hidden by requesting data source, cannot be changed through the interface
sortModel	Array<SortModel>			How to sort data
dataResponseKeyPath	string	'results'		Take a certain sub-data in response data as the result.
transformDataResponse	string			Transform the retrieved data, use eval expression, this points to the retrieved data.
translateDataResponse	bool	true		Whether to translate the request result
debounceTime	number	200		The debounce time of requesting data, will trigger leading.
defaultValue	object			The default data of the data source will be merged with the data requested by the API. If the API request returns an array, merge with each item of the array. If the API request returns an object, merge with it.
httpMethod	'get' | 'post'	'get'		HTTP method for data request.
selectColId	Array<string>			Loaded data fields. All fields will be loaded if not configured.
needCount	bool	false		Whether to query the total count (when false, the form list API will still return count, but it always equals the length of the returned data)
searchTextColIds	Array<string>	[mapping.label]		Specify the fields for fuzzy search. If not specified, searches mapping.label
requireSearchToFetch	bool	false		Whether a search condition is required before fetching data. No data will be loaded when search text is empty.
alwaysFetchOnSearch	bool	false		Whether to always re-fetch data from server when search text changes, instead of using client-side filtering.
onSelectOption	(option: object, value: string) => void			Triggered when the user selects an option from the dropdown, providing the full option object and the selected value.
itemField	object			The formatting function of option, implemented by specifying the JSON schema of each element, supporting the use of all form elements

All the remaining componentsProps will be passed to the component root element (AutoComplete).

SortModel

Name	Type	Default	Description
colId	string		Sort field id
sort	'asc' | 'desc'	'asc'	Sort in ascending or descending order
sortType	'text' | 'number' | 'date'	'text'	What type to sort values by

JS API

The interface obtained through formApi.getFieldApi() is as follows:

Name	Type	Description
node	HTML Element	The root DOM element of the component
getOptions	() => array	Get all options for AutoComplete