У меня есть код 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,
    }));
};

Что не так в моем коде? Пожалуйста, предложите

0
Lara 25 Окт 2019 в 07:50

1 ответ

Лучший ответ

Я думаю, вам нужно использовать имя, а не имя как

const handleBChange = event => {
event.preventDefault();
setValues(oldValues => ({
    ...oldValues,
    [event.target.name]: event.target.value,
}));
};

Надеюсь, это поможет

1
ibtsam 25 Окт 2019 в 07:59
Извините, что сообщаю, но по-прежнему не обновляет значение
 – 
Lara
25 Окт 2019 в 08:02
Хорошо, теперь я понял, вместе с вашим кодом это также нужно обновить как inputProps={{ name: 'Name', id: 'outlined-Name', }}
 – 
Lara
25 Окт 2019 в 08:05