How to create a simple React Dropdown
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>
If you are learning React, I believe this gets to the heart of what you were asking. Here is the JSX:
<select name="category" value={category} onChange={event => handleCategoryChange(event.target.value)}> <option id="0" >Personal</option> <option id="1" >Work</option> </select>
And here is the on change handler:
const [category, setCategory] = React.useState(''); const handleCategoryChange = (category) => { setCategory(category); console.log(category); }