如何在reactjs和Mongodb中使用材质ui来处理选择更改

Question

我有这个代码可以更新输入字段

const handleInputChange = event => {
const { name, value } = event.target
setUser({ ...user, [name]: value })
}

我想采用相同的想法，但使用Select组件

我从注册页面中选择的组件：

<Select
id="framework"
value={FrameworkValue}
onChange={handleChange}
fullWidth
label="Framework"
margin="normal"
>
<MenuItem value={'Information Security'}>Information Security</MenuItem>
<MenuItem value={'Health'}>Health</MenuItem>
<MenuItem value={'Quality Management'}>Quality Management</MenuItem>
<MenuItem value={'Financial'}>Financial</MenuItem>
</Select> 

Answer 1

您需要将name和value道具传递给Select组件，如下所示。

<Select
...
value={user.framework}
onChange={handleInputChange}
...
...
name="framework"
>
<MenuItem value={'Information Security'}>Information Security</MenuItem>
<MenuItem value={'Health'}>Health</MenuItem>
<MenuItem value={'Quality Management'}>Quality Management</MenuItem>
<MenuItem value={'Financial'}>Financial</MenuItem>
</Select> 

代码沙盒