Используя response-autosuggest, показать все предложения, соответствующие буквам

Question

Есть ли способ показать список предложений, когда я набрал первую букву А, на нем должны отображаться буквы, соответствующие всем AEg: у меня есть список студентов, например

 {
        "id": 1,
        "name": "Dee dee Tanser"
    },
    {
        "id": 2,
        "name": "Tobiah Stockwell"
    },
    {
        "id": 3,
        "name": "Gregorius Densham"
    },
    {
        "id": 4,
        "name": "Ursula Morrill"
    },
    {
        "id": 5,
        "name": "Josey Bainton"
    },

, когда пользователь вводитпервая буква в autosuggest 's', она должна отображать все совпадения с этими буквами (термин должен соответствовать либо имени, либо фамилии). В настоящее время он показывает только основу имени.

Спасибо!

Answer 1

Вы можете использовать onSuggestionsFetchRequested prop, чтобы реализовать желаемую логику. Как то так:

const students = [
  {
      "id": 1,
      "name": "Dee dee Tanser"
  },
  {
      "id": 2,
      "name": "Tobiah Stockwell"
  },
];

// Teach Autosuggest how to calculate suggestions for any given input value.
getSuggestions = value => {
    const inputValue = value.trim().toLowerCase();
    const inputLength = inputValue.length;

    if (inputLength === 0) {
        return [];
    }

    return students.filter(student => {
        return student.name.split(' ').some(term => {
            return term.toLowerCase().slice(0, inputLength) === inputValue;
        })
    });
};

  // Autosuggest will call this function every time you need to update suggestions.
  onSuggestionsFetchRequested = ({ value }) => {
    this.setState({
      suggestions: this.getSuggestions(value)
    });
  };

 <Autosuggest
    suggestions={suggestions}
    onSuggestionsFetchRequested={this.onSuggestionsFetchRequested}
    ...