title: using debounce for search input in react
body: <p>I have a search input, to make API calls on the fly. I'd like to implement debounce to reduce the amount of server calls. </p>
  
  <pre><code>  _debouncedSearch() {
      debounce(this.props.fetchRoutes(this.state.searchText), 1000);
    }
  
    _updateResults(searchText) {
      this.setState({searchText});
      this._debouncedSearch();
    }
  </code></pre>
  
  <p>I am expecting <code>debouncedSearch</code> every 1 second. But it is still called on the fly. And throw errors:</p>
  
  <blockquote>
    <p>Uncaught TypeError: Expected a function
        at debounce (lodash.js?3387:10334)</p>
    
    <p>Uncaught Error: A cross-origin error was thrown. React doesn't have access to the actual error object in development. </p>
  </blockquote>
  
  <p>I feel like this question must get asked around a lot, but none of the solution seems to work for me. Could someone explain to me what exactly is the problem here? I thought debounce is just a setTimeOut.</p>
  
  <p>Thanks</p>