CHIEFSOFT\ameye
56 lines
1.3 KiB
JavaScript
56 lines
1.3 KiB
JavaScript
import React from "react";
|
|
import Card from "@mui/material/Card";
|
|
import { Typography } from "@mui/material";
|
|
import InputLabel from '@mui/material/InputLabel';
|
|
import MenuItem from '@mui/material/MenuItem';
|
|
import FormControl from '@mui/material/FormControl';
|
|
import Select from '@mui/material/Select';
|
|
|
|
export default function DefaultSelect() {
|
|
|
|
const [age, setAge] = React.useState('');
|
|
|
|
const handleChange = (event) => {
|
|
setAge(event.target.value);
|
|
};
|
|
|
|
return (
|
|
<>
|
|
<Card
|
|
sx={{
|
|
boxShadow: "none",
|
|
borderRadius: "10px",
|
|
p: "25px",
|
|
mb: "15px",
|
|
}}
|
|
>
|
|
<Typography
|
|
as="h3"
|
|
sx={{
|
|
fontSize: 18,
|
|
fontWeight: 500,
|
|
mb: '10px'
|
|
}}
|
|
>
|
|
Default Select
|
|
</Typography>
|
|
|
|
<FormControl fullWidth>
|
|
<InputLabel id="demo-simple-select-label">Age</InputLabel>
|
|
<Select
|
|
labelId="demo-simple-select-label"
|
|
id="demo-simple-select"
|
|
value={age}
|
|
label="Age"
|
|
onChange={handleChange}
|
|
>
|
|
<MenuItem value={10}>Ten</MenuItem>
|
|
<MenuItem value={20}>Twenty</MenuItem>
|
|
<MenuItem value={30}>Thirty</MenuItem>
|
|
</Select>
|
|
</FormControl>
|
|
</Card>
|
|
</>
|
|
);
|
|
}
|