我正在尝试自定义material-ui
下拉列表,使其成为这样的内容,
这是链接https://codesandbox.io/s/busy-black-2fgdn?file=/src/App.js ,
如果我在输入中写入 1(来自),它会选择以 1 开头的选项,而不是写入输入,如果没有一个选项以输入中输入的数字开头,则它会写入输入中,
最佳答案
使用 Autocomplete
和 freeSolo
作为 prop。
检查此处的文档 => https://mui.com/components/autocomplete/#free-solo
const dataList = [
{ title: "10-100", value: "10-100" },
{ title: "100-200", value: "100-200" },
{ title: "200-300", value: "200-300" },
{ title: "300-400", value: "300-400" }
];
...
<Autocomplete
id="free-solo-demo"
freeSolo
options={dataList.map(option => option.title)}
renderInput={params => <TextField {...params} label="select or type" />}
/>
代码沙箱 => https://codesandbox.io/s/winter-cloud-y401t?file=/src/App.js
关于reactjs - 如何自定义 Material ui选择,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/70363322/