JSFiddle - React, Tailwind, and code Playground

by neosoyn

HTML

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

JavaScript 1.7

/** @jsx React.DOM */

var Hello = React.createClass({
    getInitialState: function(){
        return {clicked: []};
    },
    handleRootClick: function(event){
        if (event.target.tagName == 'A'){
            var clicked = this.state.clicked.slice();
            clicked.push(event.target.href);
            this.setState({clicked: clicked});
        }
    },
    handleLinkClick: function(event){
        event.stopPropagation();
        event.preventDefault();
    },
    render: function(){
        return (
            <div onClickCapture={this.handleRootClick}>
                <a onClick={this.handleLinkClick} href="http://www.facebook.com">Hello</a>
                <ul>
                    {this.state.clicked.map(function(item){
                        return <li>{item}</li>;
                    })}
                </ul>
            </div>
        );
    }
});
 
React.renderComponent(<Hello name="World" />, document.body);