Javascript:过滤数组项的第一个字母，然后过滤其他字母

Question

我有一系列城市，并使用搜索输入按城市名称对其进行过滤。例如，如果我输入“b”，我会看到巴塞罗那、柏林、布加勒斯特和布达佩斯，还会看到都柏林和里斯本(因为它们包含字母“b”。)

我正在寻找一种方法，首先过滤我输入的第一个字母，然后过滤其他字母。例如，如果我输入“b”，我应该只会看到巴塞罗那、柏林、布加勒斯特和布达佩斯。如果我输入“bu”，它现在应该显示布达佩斯和布加勒斯特。我怎样才能得到这个结果？

这是我的实际代码:

{this.props.cities
.filter(city => city.name.toLowerCase().indexOf(this.state.searchTerm) !== -1)
.map(item => ( <p> {item.name} </p> ))}

Answer 1

不要测试 indexOf() 是否返回 -1 以外的内容，而是测试它是否恰好返回 0。这意味着它匹配城市名称的开头。

this.props.cities
.filter(city => city.name.toLowerCase().indexOf(this.state.searchTerm) === 0)
.map(item => ( <p> {item.name} </p> ))