JSFiddle - React, Tailwind, and code Playground

by dkunin

HTML

<script src="http://fb.me/react-with-addons-0.9.0.js"></script>
<script src="http://fb.me/JSXTransformer-0.9.0.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 {boxes:[]}
    
    },
    addBox: function(e){
        e.preventDefault();
        var ar = this.state.boxes;
        ar.push(ar.length);
        console.log('smth')
        this.setState({boxes:ar})
    },
    removeBox: function(){},
    selBox: function(){
    console.log(arguments)
    },
    render: function() {    
        var boxes = this.state.boxes.map(function(b,i){return (<a href="#0 onClick={this.selBox.call(this,i)}>b, {i}</div>)}.bind(this));
        return (<div>
            {boxes}
            <a href="#0" onClick={this.addBox}>+</a>
            <a href="#0" onClick={this.removeBox} data-id={this.state.selBox}>-</a>
        </div>);
    }
});
 
React.renderComponent(<Hello name="World" />, document.body);