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

Popular posts from this blog

html - How to set bootstrap input responsive width? -

javascript - Highchart x and y axes data from json -

javascript - Get js console.log as python variable in QWebView pyqt -