Material UI Autocomplete - поиск только с начала слова - PullRequest
0 голосов
/ 27 февраля 2020

Я использую поле автозаполнения пользовательского интерфейса материала в своем приложении React и хочу, чтобы поиск в нем работал только с начала ключевого слова (для некоторых полей объектов):

Например, если варианты

[
  {data1:'abc', data2:'a123'},
  {data1:'cba', data2:'345'},
  {data1:'bca3', data2:'654'}
]

и я набираю a - должен появиться только первый вариант. Если я наберу 3 - должен появиться только второй вариант.

Ответы [ 2 ]

0 голосов
/ 28 февраля 2020

Сделано это с filterOptions Автозаполнение реквизита и 'match-sorter' библиотека:

const filterOptions = (options,{ inputValue }) =>
    matchSorter(options, inputValue, {
      keys: [
        { threshold: matchSorter.rankings.STARTS_WITH, key: 'data1' },
        { threshold: matchSorter.rankings.STARTS_WITH, key: 'data2' },
        'data3',
      ],
    });
0 голосов
/ 27 февраля 2020

https://material-ui.com/components/autocomplete/#multiple -значения

Работает, нужно добавить несколько

  <Autocomplete
    multiple
    id="tags-standard"
    options={top100Films}
    getOptionLabel={option => option.title}
    defaultValue={[top100Films[13]]}
    renderInput={params => (
      <TextField
        {...params}
        variant="standard"
        label="Multiple values"
        placeholder="Favorites"
      />
    )}
  />
...