App.portion.js

import React, { Component } from 'react';
import { debounce } from 'lodash';

class SearchBox extends Component {
  constructor(props) {
    super(props);
    this.state = {value: ''};

    // https://stackoverflow.com/a/28046731/198348
    // this.handleChange = this.handleChange.bind(this);
    this.handleChange = debounce(this.handleChange.bind(this), 300);
  }

  handleChange(event) {
    event.persist();
    console.log(event);
    this.setState({value: event.target.value});
    console.log(event.target.value);
  }
  
  render() {
    return (
      <label>
        Search: <input type="text" value={this.state.value} onChange={this.handleChange} />
      </label>
    )
  }
}