react typescript 関数コンポーネントに引数を渡したい。
Q&A
Closed
解決したいこと
react typescript 関数コンポーネントに引数を渡したいのですが、以下の場合引数の渡し方がよくわかりません。
#コンポーネント
#Select.tsx
export default function BasicSelect(title: string) {
const [age, setAge] = React.useState('');
const handleChange = (event: SelectChangeEvent) => {
setAge(event.target.value as string);
};
return (
<Box >
<FormControl sx={{ width: '100%' }}>
<InputLabel id="demo-simple-select-label">{title}</InputLabel>
<Select
labelId="user-label"
id="user"
value={age}
label="Age"
onChange={handleChange}
>
<MenuItem value={10}>yoshi1</MenuItem>
<MenuItem value={20}>yoshi2</MenuItem>
<MenuItem value={30}>yoshi3</MenuItem>
</Select>
</FormControl>
</Box>
);
}
下のような感じで引数を渡そうとしています。
import Select from './Components/Fields/Select'
function App() {
return (
<div className="App">
<Select title='test'></Select>
</div>
);
}
慣れてなくて引数の渡し方に困っています。
0