Ecme - The Ultimate Next & TypeScript Web Template

Select

Select allows a user to pick single or multiple options from a list. This component is a wrapper of react-select.

Basic Usage.

Please Select

There's three sizes of option for Select.

Please Select

By setting isMulti to true, we can select multiple options from the list.

Purple

Red

Example of disabled.

Certain options disabled

Purple

Red

Select is searchable by default, but we can also turn it off by setting isSearchable to false.

Please Select

Options can be grouped with nested data.

Blue

React-select allow us to make customization the building block of the component, refer here for more detail infomation

United State

China

Japan

Use the Async component to load options from a remote source as the user types.

Select...

We can also load options upon clicking the Select.

Select...

Example of creating new option via Select input.

Type something...

Prop	Description	Type	Default
componentAs	Receive extensive component from react-select, such as `Async` & `Creatable`	`ReactNode`	`ReactSelect`
size	Select size	`'lg'` \| `'md'` \| `'sm'`	`'md'`

Select is a wrapper component of react-select.

All react-select props can be applied on this component, refer official docs for the complete api list.