我在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,
}));
};
我的代码有什么问题?请建议
最佳答案
我认为您需要使用名称而不是名称
const handleBChange = event => {
event.preventDefault();
setValues(oldValues => ({
...oldValues,
[event.target.name]: event.target.value,
}));
};
希望能帮助到你
关于javascript - 无法在实质性UI下拉列表中更新所选选项,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/58552352/