Arbeiten mit select in React
Lassen Sie uns nun mit Dropdown-Listen
select
beschäftigen.
Die Arbeit mit ihnen unterscheidet sich praktisch nicht
von der Arbeit mit Inputs und Checkboxen.
Nehmen wir an, wir haben eine solche Selectbox:
function App() {
return <div>
<select>
<option>text1</option>
<option>text2</option>
<option>text3</option>
<option>text4</option>
</select>
</div>;
}
Lassen Sie uns ihre Funktionalität mit React sicherstellen:
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>
Ihre Auswahl: {value}
</p>
</div>;
}
Erstellen Sie eine Dropdown-Liste mit Städten. Fügen Sie auch einen Absatz hinzu, in dem die Auswahl des Benutzers ausgegeben wird.
