Cascader
Component documentation for Cascader.
Cascader
Component documentation for Cascader.
Basic Usage
Cascader
Demo loads on client.
Notes
- Single-select
modelValueis a path array; multi-select is an array of path arrays. expandTriggercontrols click/hover expansion (inhovermode, clicking non-leaf nodes will not expand).- Async
loadonly triggers when a node has nochildrenand is not markedleaf.
API
TxCascader Props
| Prop | Type | Default | Description |
|---|---|---|---|
modelValue | CascaderValue | - | Description for modelValue. |
options | CascaderNode[] | [] | Description for options. |
multiple | boolean | false | Description for multiple. |
disabled | boolean | false | Description for disabled. |
placeholder | string | 'Text' | Description for placeholder. |
searchable | boolean | true | Description for searchable. |
clearable | boolean | true | Description for clearable. |
placement | PopoverPlacement | 'bottom-start' | Description for placement. |
dropdownOffset | number | 6 | Description for dropdownOffset. |
dropdownWidth | number | 360 | Description for dropdownWidth. |
dropdownMaxWidth | number | 520 | Description for dropdownMaxWidth. |
dropdownMaxHeight | number | 340 | Description for dropdownMaxHeight. |
expandTrigger | 'click' | 'hover' | 'both' | 'both' | TextTriggerText |
load | (node, level) => Promise<CascaderNode[]> | - | Description for load. |
CascaderNode
| Field | Type | Description |
|---|---|---|
value | string | number | Description for value. |
label | string | Description for label. |
disabled | boolean | Description for disabled. |
leaf | boolean | Description for leaf. |
children | CascaderNode[] | Description for children. |
CascaderValue
- Single select:
CascaderPath(Array<string | number>) - Multi select:
CascaderPath[]
Events
| Event | Params | Description |
|---|---|---|
update:modelValue | (v) | Description for update:modelValue. |
change | (v) | Description for change. |
open | - | Description for open. |
close | - | Description for close. |
Expose
| Name | Type | Description |
|---|---|---|
open() | () => void | Description for open(). |
close() | () => void | Description for close(). |
toggle() | () => void | Description for toggle(). |
focus() | () => void | Description for focus(). |
blur() | () => void | Description for blur(). |
clear() | () => void | Description for clear(). |
setValue(v) | (v) => void | Description for setValue(v). |
getValue() | () => any | Description for getValue(). |
Was this helpful?