如何在 reactjs 和 Mongodb 中使用 material-ui 处理选择更改答案

【问题标题】：How to handle select change using material-ui in reactjs and Mongodb如何在 reactjs 和 Mongodb 中使用 material-ui 处理选择更改
【发布时间】：2022-01-03 11:52:21
【问题描述】：

我有更新输入字段的代码

    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>

【问题讨论】：

标签： reactjs react-redux react-hooks

【解决方案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>

Code sandbox

【讨论】：

@JHS99，看看这个！！