material-ui-dropdown v0.1.0
Material UI Dropdownlist
A @material-ui helper to cut off the whole boilerplate to work with select component from @material-ui.
Getting started
Install material-ui-dropdownlist
npm install material-ui-dropdownlist
oryarn add material-ui-dropdowlist
Import material-ui-dropdowlist
into your application
import MuiDropdownList from "material-ui-dropdowlist";
Setting up the dropdown
<MuiDropdownList
defaultText="Select item..."
options={persons}
placeholder="Persons"
optionText="name"
optionValue="id"
value={this.state.value}
onChange={this.handleChange}
showError={this.state.showError}
errorText={this.state.errorText}
/>
defaultText
: Text that will appear as default option (empty value)
options
: Array of available options
- Options should be an object with properties to be used as option text and option value
placeholder
: Dropdown's placeholder
optionText
: String - Property from the object in options
that you want to be displayed
optionValue
: String - Property from the object in options
that you want to be the value (normally the object ID)
value
: String - Selected item
onChange
: Function - Callback you want to executed when an item is selected.
- Returns the selected object
showError
: Boolean - Change dropdown's color to red, indicating error.
errorText
: String - Error message you want to display
In addition you can use all properties from Material TextField to customize your dropdown
P.S.: This dropdown does not accept multiple selection (maybe in the future)
6 years ago