A2SelectField

Select dropdown field with options.

Props

Property	Type	Default	Description
label	string	-	Field label
prop	string	-	Form data key
placeholder	string	-	Placeholder text
options	array	[]	Select options
clearable	boolean	false	Clear button
disabled	boolean	false	Disabled state

Option Structure

interface SelectOption {
  label: string
  value: string | number
  disabled?: boolean
}

Default Value (Flat Format)

In flat format, you can set an initial selected option using value.default:

{
  "id": "genderField",
  "component": "SelectField",
  "label": "Gender",
  "options": [
    { "label": "Male", "value": "male" },
    { "label": "Female", "value": "female" }
  ],
  "value": { "path": "/form/gender", "default": "male" }
}

SelectField with Default Value

[ { "id": "root", "component": "Card", "child": "genderField", "width": "xs" }, { "id": "genderField", "component": "SelectField", "label": "Gender", "placeholder": "Select gender", "options": [ { "label": "Male", "value": "male" }, { "label": "Female", "value": "female" } ], "value": { "path": "/form/gender", "default": "male" } } ]

无内容

Basic Example

Basic Select

{ "id": "select1", "type": "a2-select-field", "props": { "label": "Country", "prop": "country", "placeholder": "Select country", "options": [ { "label": "China", "value": "cn" }, { "label": "USA", "value": "us" }, { "label": "Japan", "value": "jp" } ] } }

无内容

Clearable Example

Clearable Select

{ "id": "select2", "type": "a2-select-field", "props": { "label": "Status", "prop": "status", "placeholder": "Select status", "clearable": true, "options": [ { "label": "Active", "value": "active" }, { "label": "Inactive", "value": "inactive" }, { "label": "Pending", "value": "pending" } ] } }

无内容

JSON Schema

{
  "id": "selectId",
  "type": "a2-select-field",
  "props": {
    "label": "Select Label",
    "prop": "fieldName",
    "placeholder": "Select option",
    "options": [
      { "label": "Option 1", "value": "opt1" },
      { "label": "Option 2", "value": "opt2" }
    ],
    "clearable": false
  }
}