使用 react-autosuggest，显示与字母匹配的所有建议

Question

有没有办法在我输入第一个字母 A 时显示建议列表，它应该显示与所有 A 匹配的字母。 例如：我有一个学生名单，例如

{
"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"
},

当用户在自动建议"s"中键入第一个字母时，它应该呈现与该字母的所有匹配(术语应与名字或姓氏匹配(。 目前，它仅显示名字基础。

谢谢！

Answer 1

您可以使用onSuggestionsFetchRequestedprop来实现您想要的逻辑。像这样：

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}
...