import React, { Component } from 'react';

class Example extends Component {
    constructor(props) {
        super(props);
        this.state = {
            query: [],
            item: ''
        }
    }

    render() {
        return(
            <div>
              <form>
                <fieldset>
                    <legend>Example</legend>
                    <input
                      type="text"
                      onChange={e => {this.setState({item: e.target.value})}} />
                    <button
                      onClick={() => {this.setState({ query: [...this.state.query, this.state.item]})}}>Add Item to Array
                    </button>
                </fieldset>
              </form>
            {
                this.state.query.map((q, key) => {
                    return(
                        <li key={key}>{q}</li>
                    )
                })
            }
            </div>
        )
    }
}

export default Example;