reactjs - react-select: Do we need CSS as well just to display a normal select list? -
i have following code displays normal select list. working fine logically , able log when change happens. problem is, small box being displayed instead of text box adequate show options.and placeholder being displayed normal text. when click on placeholder, values being displayed.
import select 'react-select; class selectlist extends component { onchange() { console.log("value changed"); } render() { var select = require('react-select'); var options = [ { value: 'one', label: 'india' }, { value: 'two', label: 'singapore' }, { value: 'three', label: 'iceland' } ]; return( <select name="select list" value="one" options={options} onchange={this.onchange.this(bind}} /> ); }
do need css things here. let me know missing here?
[1]: https://i.stack.imgur.com/na4ht.png
you're importing select @ top, why doing
var select = require('react-select');
again in render function?
also onchange handler should onchange={this.onchange} , can bind handler @ top in constructor this:
this.onchange = this.onchange.bind(this);
or can pass select component this
onchange={() => {this.onchange()}}
as css issue, github:
// sure include styles @ point, during bootstrapping
import 'react-select/dist/react-select.css';
Comments
Post a Comment