SearchBar 为每个字母调用一个方法

Question

我有来自react-native-elements组件的SearchBar，它在过滤数据方面工作得很好，但一旦它为每个键入的字母调用搜索方法，它就不具有执行力。

我的意思是，如果我输入 TEST，它将显示“T”结果，然后是“TE”结果，然后是“TES”结果，最后是“TEST”结果，一次一个。

我不打算使用提交按钮。官方文档仅显示 onChangeText 触发某些方法。

问题： 那么，有没有一种方法可以在输入完成后只调用该方法一次？

搜索栏组件：

<SearchBar 
  onChangeText={(text) => this.search(text) }
  onClear={this.setState({noMatches: true})}
  showLoadingIcon={this.state.searching}
/>

搜寻方法：

 search = (text) => {

        requestMonitorados(text).then((value) => {

                setTimeout(() => {
                    this.setState(data: value); //Updating list of data
               }, 3000);

        });
    }

Answer 1

您可以延迟调用，this.search直到一段时间内没有检测到新的按键输入：

onChangeText={(text) => {
  this.text = text;
  clearTimeout(this.timeout); // clears the old timer
  this.timeout = setTimeout(() => this.search(this.text), WAIT_TIME);
}}

componentWillUnmount() {
  clearTimeout(this.timeout);
}