React: Как повесить обработчик события на кнопку?

Question

Сергей @SerGeGR

React: Как повесить обработчик события на кнопку?

Добрый день,
Только осваиваю React. Делаю виджет добавления комментария вместе с именем пользователя. Удалось повесить возможность добавления комментария при нажатии на Enter, а вот с добавлением через кнопку запутался.

class TodoApp extends React.Component {
  constructor() {
    super(); //конструктор из React.Component

    //Исходное состояние приложения
    this.state = {
      comments: [{ name: "", comment: "" }],
      //Новый ключ для добавления новых пунктов
      newName: "",
      newComment: ""
    };
  }

  addComment() {
    const todos = this.state.comments;
    //Добавление новой задачи через пуш
    todos.push({
      name: this.state.newName,
      comment: this.state.newComment
    });

    //Обновление состояния приложения
    this.setState({
      todos,
      newName: "",
      newComment: ""
    });
  }

  //Правила рендеринга приложения
  render() {
    return (
      //Итерация по задачам
      <div>
        <div>
          <input
            type="text"
            placeholder="Введите имя"
            value={this.state.newName}
            onChange={ev => {
              this.setState({ newName: ev.target.value });
            }}
            onKeyUp={ev => {
              if (ev.keyCode === 13) this.addComment();
            }}
          />
        </div>
        <textarea
          type="text"
          placeholder="Введите комментария"
          value={this.state.newComment}
          // Изменения введеные в инпут
          onChange={ev => {
            this.setState({ newComment: ev.target.value });
          }}
          //Добавление по нажатию на Энтер
          onKeyUp={ev => {
            if (ev.keyCode === 13) this.addComment();
          }}
        />
        <div>
          <button>Отправить</button>
        </div>
        <div>
          {this.state.comments.map((todo, i) => {
            //Создается локальная переменная
            //Возвращается элемент
            return (
              <div key={i}>
                {todo.name}
                {todo.comment}
              </div>
            );
          })}
        </div>
      </div>
    );
  }
}