反应事件处理程序。向数组添加值

import React, { Component } from 'react';
import ListItem from './list-item';

export default class App extends Component {
  constructor(props) {
    super(props);

    this.state = { tasks: [] };
    this.addTask = this.addTask.bind(this);
  }

  addTask(event) {
    event.preventDefault();
    var form = this._input.value;
    var allTasks = this.state.tasks.concat([form]);
    this.setState({tasks: allTasks});
    console.log(this.state.tasks);
  }

  render() {
    return (
      <div className="app-main">
        <div className="col-sm-12 text-center">
          {/* App Title */}
          <h1>Task App</h1>
          <div id="formWrapper">
            {/* Start of Form */}
            <form onSubmit={this.addTask}>
              <input ref={(el) => this._input = el} />
              <button type="submit" className="btn btn-md btn-primary">Add</button>
            </form>
            {/* List Item */}
            <ListItem tasks={this.state.tasks} />
          </div>
        </div>
      </div>
    );
  }
}