Arbeid med select i React
La oss nå ta for oss rullegardinlister
select.
Arbeid med dem skiller seg praktisk talt ikke
fra arbeid med inputs og avmerkingsbokser.
La oss si at vi har en slik select:
function App() {
return <div>
<select>
<option>text1</option>
<option>text2</option>
<option>text3</option>
<option>text4</option>
</select>
</div>;
}
La oss sikre dens funksjon ved hjelp av React:
function App() {
const [value, setValue] = useState('');
function handleChange(event) {
setValue(event.target.value);
}
return <div>
<select value={value} onChange={handleChange}>
<option>text1</option>
<option>text2</option>
<option>text3</option>
<option>text4</option>
</select>
<p>
ditt valg: {value}
</p>
</div>;
}
Lag en rullegardinliste for byer. Lag også et avsnitt der brukerens valg skal skrives ut.