import { useState } from "react";
function App() {
const [fruit, setFruit] = useState("");
const handleChange = (event) => {
setFruit(event.target.value);
};
return (
<div>
<h2>Select a Fruit</h2>
<select value={fruit} onChange={handleChange}>
<option value="">Choose</option>
<option value="Apple">Apple</option>
<option value="Mango">Mango</option>
<option value="Banana">Banana</option>
</select>
<p>You selected: {fruit}</p>
</div>
);
}
export default App;
×
React.js Tutorial
- React.js Introduction
- React.js JSX
- React.js Components
- React.js Rendering
- React.js Fragment
- React.js Props
- React.js Routing
- React.js Hooks
- React.js Event
- React.js Sass
- React.js List
- React.js Formsubmit
- React.js Css
- React.js Select
- React.js Project Structure
- React.JS Lazy Loading
- React.js Memo
- React.js useMemo
- React.js useCallback
- React.js API Services
- React.js Image Upload
- React.js PDF Generate
- React.js Reconciliation
- React.js Redux
ES6 Reactjs
React.js Packages
React.js Tutorial
- React.js Introduction
- React.js JSX
- React.js Components
- React.js Rendering
- React.js Fragment
- React.js Props
- React.js Routing
- React.js Hooks
- React.js Event
- React.js Sass
- React.js List
- React.js Formsubmit
- React.js Css
- React.js Select
- React.js Project Structure
- React.JS Lazy Loading
- React.js Memo
- React.js useMemo
- React.js useCallback
- React.js API Services
- React.js Image Upload
- React.js PDF Generate
- React.js Reconciliation
- React.js Redux