Material-ui 自动完成警告提供给自动完成的值无效。您可以使用 getOptionSelected` 属性来自定义相等性测试
Material-ui Autocomplete warning The value provided to Autocomplete is invalid. You can use the getOptionSelected` prop to customize the equality test
我正在使用自动完成 material-ui。但我收到“提供给自动完成的值无效”警告。
None 个选项与 `` "" . 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}
/>
)}
/>
我尝试按照说明进行操作,但仍然失败。大家帮帮我
再见,我做了一个工作示例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;
}
});
仅此而已。我在控制台中没有错误。
我正在使用自动完成 material-ui。但我收到“提供给自动完成的值无效”警告。
None 个选项与 `` "" . 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}
/>
)}
/>
我尝试按照说明进行操作,但仍然失败。大家帮帮我
再见,我做了一个工作示例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; } });
仅此而已。我在控制台中没有错误。