title: multiple textfields onChange function issue
body: <p>There's a plus button to increase the number of textfields in the page. After increasing the textfields, I want to show all the textfield input value at once under, after clicking on the submit button.
  But here it's giving a problem on the onChange setState issue. How to handle it ? Any help ?</p>
  
  <p>Here's the => <strong><a href="https://stackblitz.com/edit/react-upqstr" rel="nofollow noreferrer">DEMO</a></strong></p>
  
  <pre><code>class App extends Component {
  
  constructor(props) {
      super(props);
      this.state = { 
        arr: [],
        firstname: '',
        lastname: '',
        setarr: [],
        temp: []
      };
      this.addTextfields = this.addTextfields.bind(this);
      this.changeFirstname = this.changeFirstname.bind(this);
      this.changeLastname = this.changeLastname.bind(this);
    }
  
    addTextfields(e) {
      let htmlContent = [];
      htmlContent.push(
        &lt;div&gt;
          &lt;input type="text" placeholder="first name" onChange={this.changeFirstname} value={this.state.firstname} /&gt; &lt;br/&gt; &lt;br/&gt;
          &lt;input type="text" placeholder="last name" onChange={this.changeLastname} value={this.state.lastname} /&gt; &lt;br/&gt; &lt;br/&gt;
        &lt;/div&gt;
      );
      this.setState({ arr: this.state.arr.concat(htmlContent) });
    }
  
    changeFirstname(e) {
      this.setState({ firstname: e.target.value });
    }
  
    changeLastname(e) {
      this.setState({ lastname: e.target.value });
    }
  
    showTexts() {
      console.log(this.state.firstname, this.state.lastname);
      var add = [this.state.firstname, this.state.lastname];
      this.state.temp = this.state.temp.concat(add);
      this.setState({ setarr: this.state.temp, firstname: '', lastname: '' });
      // localStorage.setItem(this.state.arr, 'names');
    }
  
    render() {
      return (
        &lt;div&gt;
          &lt;div className="App"&gt;
            &lt;input type="text" onChange={this.changeFirstname} placeholder="first name" value={this.state.firstname} /&gt; &lt;br/&gt; &lt;br/&gt;
            &lt;input type="text" onChange={this.changeLastname} placeholder="last name" value={this.state.lastname} /&gt; &lt;br/&gt; &lt;br/&gt;
            &lt;button type="submit" onClick={this.addTextfields}&gt;Plus&lt;/button&gt;
            {this.state.arr}
          &lt;/div&gt;
          &lt;div className="submit-button"&gt;
            &lt;button type="submit" onClick={this.showTexts.bind(this)}&gt;Submit&lt;/button&gt;
          &lt;/div&gt;
          &lt;div&gt;
            {this.state.setarr}
          &lt;/div&gt;
        &lt;/div&gt;
      );
    }
  }
  
  render(&lt;App /&gt;, document.getElementById('root'));
  </code></pre>