如何解决Material-ui自动完成警告提供给自动完成的值无效您可以使用getOptionSelected`道具来自定义相等性测试
我正在使用自动完成材料UI。但是我收到“向自动完成提供的值无效”的警告。
没有一个选项与““” . You can use the
getOptionSelected`道具自定义相等性测试相匹配”
<Autocomplete
id="district combo-box-demo"
value={defaultValueDistrict}
onChange={(event,value) => {
if (value && value.districtName) {
setDefaultValueDistrict(value);
}
}}
options={lisdata}
getOptionLabel={(option) =>
option.districtName ? option.districtName : ""
}
getOptionSelected={(option,value) =>
option.districtName === value.districtName
}
style={{ width: 190 }}
renderInput={(params) => (
<CssTextField
style={{ background: "white" }}
{...params}
variant="outlined"
placeholder="Nhập quận/huyện"
name="district"
onBlur={handleBlur}
/>
)}
/>
我尝试按照说明进行操作,但仍然失败。大家请帮我
解决方法
Ciao,我做了一个有效的示例here。
基本上,我通过添加以下代码来复制代码:
-
您通过我导入的数据:
import { lisdata } from "./lisdata";
-
添加了
defaultValueDistrict
状态(以空字符串作为初始值)const [defaultValueDistrict,setDefaultValueDistrict] = useState("");
-
模拟数据来自apicall:
const [data,setData] = useState([]); const firstLoad = useRef(true); useEffect(() => { if (firstLoad.current) { // this is just a technique to run below code just one time setTimeout(() => { // simulated called api (data comes after 5 sec) setData(lisdata); },5000); firstLoad.current = false; } });
仅此而已。控制台没有错误。
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。