Hsn*_*edi 10 autocomplete reactjs material-ui react-hooks
我正在使用 material-ui Autocomplete。当用户更改输入时,它会异步从后端获取建议。这是代码的一部分:
const [options, setOptions] = useState([]);
<Autocomplete
...
freeSolo={true}
options={options}
renderInput={params => (
<TextField
...
{...params}
onChange={async (e) => {
// get suggestions from backend
const suggestions = await getSuggestions(e.target.value);
// update autocomplete options
setOptions(suggestions);
...
}}
InputProps={{
...params.InputProps,
endAdornment: (
<React.Fragment>
{loading ? <CircularProgress color="inherit" size={20} /> : null}
{params.InputProps.endAdornment}
</React.Fragment>
),
}}
/>
)}
/>
Run Code Online (Sandbox Code Playgroud)
问题是 material-ui 自动完成没有显示使用“setOptions”设置的所有选项。它过滤它们。
例如:假设用户输入“appl”,getSuggestions 返回[“apple”, “orange”, “potato”]。但它只显示“apple”,因为它过滤掉了“orange”和“potato”。
如何禁用过滤?
Dek*_*kel 18
该filterOptions方法旨在让您自由决定哪些选项可用,哪些将隐藏。
如果您只想显示所有选项 - 只需实现filterOptions返回所有值:
filterOptions={(options, state) => options}
Run Code Online (Sandbox Code Playgroud)
| 归档时间: |
|
| 查看次数: |
4759 次 |
| 最近记录: |