Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to create a simple React Dropdown

Tags:

reactjs

How do you create a very, very simple dropdown select with React? Nothing seem to work.

I have an array: var num = [1,2,3,4,5]

Function:

num(e){
 this.setState({selected: e.target.value});
}

In the render:

<select option="{num}"  value={this.state.selected} onChange={this.num} />

No error message, no nothing. I normally use npm plugin for this but I only need something basic.

like image 811
Sylar Avatar asked Mar 10 '16 09:03

Sylar


1 Answers

Setting option={num} will not work in jsx. You need to use <option> tags:

Something like this is what you are after:

<select name="select" onChange={this.num}>
  {num.map(function(n) { 
      return (<option value={n} selected={this.state.selected === n}>{n}</option>);
  })}
</select>
like image 75
Davin Tryon Avatar answered Sep 24 '22 04:09

Davin Tryon