IT Tools

Handy tools for developer

Compare Texts

WebView Playground

ReactJS Playground

Json Web Tokens

Regular Expressions

Image Crop

Color Picker

QR Code

Generate Text

Generate API Response

JSON Formatter

Number Converter

Random Wheel

Ctrl + K

Dropdown

Preview

Enter city

Show code

<Dropdown
  value={city}
  placeholder="Enter city"
  disabled={false}
  options={[
    { label: "Danang", value: "Danang" },
    { label: "Hanoi", value: "Hanoi" },
    { label: "New York", value: "New York" },
    { label: "Paris", value: "Paris" },
    { label: "Barcelona", value: "Barcelona" },
    { label: "Milan", value: "Milan" },
    { label: "Berlin", value: "Berlin" },
    { label: "Tokyo", value: "Tokyo" },
  ]}
  onChange={setCity}
/>

Docs

Name	Description	Default	Control
value *	Value of Dropdown	-	-
placeholder	Placeholder text of Dropdown	-
disabled	Disabled status of Dropdown	false	falsetrue
options *	Options list of Dropdown `Array<{ label: string; value: string }>`	-	-
className	Wrapper class	-	-

IT Tools

Tools

UI Components

Dropdown

Preview

Docs