JSFiddle - React, Tailwind, and code Playground

by spicyj

HTML

<script src="http://fb.me/react-js-fiddle-integration.js"></script>

<div id="content"></div>

JavaScript 1.7

/** @jsx React.DOM */

var Hello = React.createClass({
    getInitialState: function() {
        return {toggled: false};
    },

    handleClick: React.autoBind(function() {
        this.setState({toggled: !this.state.toggled});
    }),

    render: function() {
        var button = <input type="button" onClick={this.handleClick} value="toggle order" />;

        if (this.state.toggled) {
            return <div>
                {button}
                <p key="2">two</p>
                <p key="1">one</p>
                <p key="3">three</p>
            </div>
        } else {
            return <div>
                {button}
                <p key="1">one</p>
                <p key="2">two</p>
                <p key="3">three</p>
            </div>;
        }
    }
});
 
React.renderComponent(<Hello />, document.getElementById("content"));