Cascader

A select for a value that lives in a tree: each column narrows the next, and the value is the path rather than a single leaf.

Basic

Pass nested options to pick a path level by level, like Turkish, Desserts, Laz böreği, and preset one with defaultValue.

Sizes

Set size to large or small to change the field's height, with the middle size as the default.

Variants

Set variant to outlined, filled, text, underlined, borderless or bare to change how the field is drawn. text fills on hover and while open, and bare draws nothing at all.

Status

Set status to warning or error to color the field's border for validation.

Multiple

Set multiple to check several paths at once, each shown as a tag, and disableCheckbox on an option that can be opened but not checked.

Checked strategy

Set showCheckedStrategy to report a fully checked branch as its parent with SHOW_PARENT, or as every leaf in it with SHOW_CHILD.

Expand on hover

Set expandTrigger="hover" to open the next column when the pointer rests on an option, instead of on click.

Change on select

Set changeOnSelect to accept any level as the value, so picking Turkish alone closes the picker without going down to a dish.

Disabled option

Set disabled on an option to block it, whether a single dish like Osso buco or a whole branch like French.
Set showSearch to filter by typing, which matches every level of a path, so Dessert finds the desserts of every cuisine.

Lazy load

Pass loadData to fetch an option's children when the reader opens it, with isLeaf: false on options that have more to load.

Custom display

Pass displayRender to choose how the chosen path reads in the closed field, like the cuisine's flag before labels joined with an arrow.

Field names

Pass fieldNames to read options that use other keys, like name and code, without remapping your data first.

Panel

Use Cascader.Panel to show the columns inline with no trigger or popup, to place inside a Popover or a form of your own.

API Reference

Cascader
Cascader's props. Rows marked antuikit in the Version column are added by the kit.
showSearch
The keys of the object showSearch takes. Rows marked antuikit in the Version column are added by the kit.