App.js

import React from 'react';
import AutoComplete from 'react-autocomplete'

const AutoCompleteWrapper = ({ selectedItem, items, onChange }) => (
  <AutoComplete
    getItemValue={(item) => selectedItem.label}
    items={items}
    renderItem={(item, isHighlighted) => <div key={item.label}>{item.label}</div>}
    value={selectedItem.label}
    onChange={(event, value) => onChange({ key: '', label: value })}
    onSelect={(val, item) => onChange(item)}
    shouldItemRender={(item, value) => item.label.toLowerCase().indexOf(value.toLowerCase()) !== -1}
  />);

class App extends React.Component {
  constructor() {
    super();
    this.state = {
      selectedItem: { key: '', label: '' },
      items: [
        { key: 'SIN', label: 'Singapore (SIN)' },
        { key: 'KUL', label: 'Kuala Lumpur (KUL)' },
        { key: 'BKK', label: 'Bangkok (BKK)' },
        { key: 'CGK', label: 'Jakarta (CGK)' },
        { key: 'TPE', label: 'Taipei (TPE)' },
      ]
    }
  }

  onChange = (selectedItem) => {
    this.setState({ selectedItem }, () => {
      console.log(this.state.selectedItem);
    })
  };

  render() {
    return (
      <AutoCompleteWrapper items={this.state.items} selectedItem={this.state.selectedItem} onChange={this.onChange} />
    );
  }
}

export default App;