Автозаполнение пользовательского интерфейса материала работает не так, как ожидалось, не принимает запятые

#javascript #reactjs #material-ui

Вопрос:

Ниже приведен пример их документации. Я пытаюсь разрешить пользователю использовать запятые, чтобы выбрать несколько значений из выпадающего списка.

Если входные данные есть Part 1 , компонент работает просто отлично, но если входные данные есть Part 1, Part 2 или просто 1,2 есть , то компонент , похоже, думает, что вариантов для выбора нет.

Я пытался добавить freeSolo реквизит, но это не сработало.

Что здесь происходит?

 import * as React from "react";
import TextField from "@material-ui/core/TextField";
import Autocomplete from "@material-ui/core/Autocomplete";

export default function ComboBox() {
  return (
    <Autocomplete
      disablePortal
      id="combo-box-demo"
      options={top100Films}
      multiple
      sx={{ width: 300 }}
      renderInput={(params) => <TextField {...params} label="Movie" />}
    />
  );
}

// Top 100 films as rated by IMDb users. http://www.imdb.com/chart/top
const top100Films = [
  { label: "Part 1", year: 1994 },
  { label: "Part 2", year: 1972 },
  { label: "Part 3", year: 1974 },
];
 

комбинированный блок-материал-демонстрационный-раздвоенный-ni958?

Ответ №1:

Для тех, кто придет сюда в будущем, мне удалось исправить это, добавив filterOptions реквизит.