Material-UI<;AutoComplete/>;getOptionLabel-将空字符串作为值传递
我使用的是Material-UI AutoComplete。我将一些状态数组传递给它的属性选项。我面临的问题是getOptionLabel:
Material-UI: The `getOptionLabel` method of Autocomplete returned undefined instead of a string for [""].
我有两个组件。子项为:
const StateSelect = (props) => {
const classes = useStyles();
const handlePick = (e, v) => {
props.setState(v);
};
return (
<Autocomplete
className={classes.inputStyle}
options={states}
getOptionLabel={(option) => (option ? option.name : "")}
onChange={handlePick}
value={props.state}
renderInput={(params) => (
<TextField {...params} label="State" variant="outlined" />
)}
/>
);
};
在父组件中,我调用此子组件:
<StateSelect
state={selectedState}
setState={(state) => setSelectedState(state)}
/>
在父对象中,我有一个控制StateSelect:
值的Reaction钩子 const [selectedState, setSelectedState] = useState([""]);
所以,当我最初将selectedState作为属性传递给StateSelect时,它是[‘’],并且我收到了这个错误消息。如何将空值作为初始值传递而不出现此错误?
我上传了代码的简单版本:
https://codesandbox.io/s/smoosh-field-j2o1p?file=/src/inputStates/input.js
解决方案
我收到了相同的错误。而且,下面的方法对我很有效。
getOptionLabel={(option) => option.name || ""}
相关文章