无法更新材质 UI 下拉列表中的选定选项

Question

我有以下material ui代码select dropdown，它无法更新下拉列表中的选定选项。

 <FormControl variant="outlined" className={classes.formControl}>

    <InputLabel ref={inputLabel} htmlFor="outlined-Name">

      Name

    </InputLabel>

    <Select

      value={values.Name}

      onChange={handleBChange}

      labelWidth={labelWidth}

       inputProps={{

       Name: 'Name',

       id: 'outlined-Name',

     }}

  >

  <MenuItem value="">

   <em>None</em>

  </MenuItem>

  <MenuItem value="1">Name1</MenuItem>

  <MenuItem value="2">Name2</MenuItem>

  <MenuItem value="3">Name3</MenuItem>

  </Select>

  </FormControl>

以下是所需的事件和 JS。

const [values, setValues] = React.useState({

    Name: ''

});

const inputLabel = React.useRef(null);

const [labelWidth, setLabelWidth] = React.useState(0);

React.useEffect(() => {

    setLabelWidth(inputLabel.current.offsetWidth);

}, []);

const handleBChange = event => {

    event.preventDefault();

    debugger;

    setValues(oldValues => ({

        ...oldValues,

        [event.target.Name]: event.target.value,

    }));

};

我的代码有什么问题？请建议

Answer 1

我认为您需要使用 name 而不是 Name asconst handleBChange = event => {event.preventDefault();setValues(oldValues => ({&nbsp; &nbsp; ...oldValues,&nbsp; &nbsp; [event.target.name]: event.target.value,}));};希望能帮助到你