JSFiddle - React, Tailwind, and code Playground

by Anton Kolesnikov

JavaScript

var CommentForm = React.createClass({
  getInitialState: function() {
    return {author: '', text: ''};
  },
  handleAuthorChange: function(e) {
    this.setState({author: e.target.value});
  },
  handleTextChange: function(e) {
    this.setState({text: e.target.value});
  },
  handleSubmit: function(e) {
  	e.preventDefault();
    var author = this.state.author.trim();
    var text = this.state.text.trim();
    if (!text || !author) {
    	return;
    }
    this.setState({author: '', text: ''});
  },
  render: function() {
  	return (
    	<form className ="commentForm" onSubmit={this.handleSubmit}>
      	<input type="text" placeholder="Name" onChange={this.handleAuthorChange} />
        <br />
        <input type="text" placeholder="Message" onChange={this.handleTextChange} />
        <br />
        <input type="submit" />
      </form>
    )
  }
});