javascript - 如何暂停 React-Autosuggest 搜索，直到异步数据准备就绪？

Question

我有一个使用 React-Autosuggest 的功能搜索少量数据，所有数据从后端获取后都存储在内存中。换句话说，在初始批量获取之后，不再有网络调用来支持搜索。

当搜索框调用 onSuggestionsFetchRequested 时，我调用的函数天真地查看 this.props.dataset 以返回搜索建议。

    <Autosuggest
      ...
      onSuggestionsFetchRequested={({value}) => {this.setState({currentSearchSuggestions: this.getSuggestions(value)});}}
      ...
    />

    getSuggestions(rawValue) {
      const toSearchThrough = Object.values(this.props.dataset);
      ...
    }

但是，如果用户在填充 this.props.dataset 之前输入搜索，则即使在数据加载后也不会显示任何建议，直到用户更改输入轻微，导致再次调用 getSuggestions。

我可以采取一些巧妙的措施来阻止 getSuggestions 直到数据集准备就绪吗？同样，这只会在每个页面加载后发生。

Answer 1

我认为这可以解决您的问题。

componentDidUpdate(prevProps) {
  // Assume this.state.searchQuery is set on user input via onChange defined in Autosuggest inputProps
  if (this.state.searchQuery && this.props.dataset !== prevProps.dataset) {
    this.setState({currentSearchSuggestions: this.getSuggestions(searchQuery)});}
  }
}