JSFiddle - React, Tailwind, and code Playground

by ChaseWest

HTML

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

JavaScript 1.7

/** @jsx React.DOM */

var data = {
    'cols': ['one', 'two', 'three', 'four'],
    'rows': [
        {
            'one': 1,
            'two': 2,
            'three': 3,
            'four': 4
        },
        {
            'one': 'Won',
            'two': 'Too',
            'three': 'Free',
            'four': 'For'
        }        
    ],
    
}

var Table = React.createClass({
    render: function() {
        return (
            <table>
                <TableHead cols={this.props.cols}>Hello</TableHead>
                <TableBody rows={this.props.rows} cols={this.props.cols}>World</TableBody>
            <table>
        );
    }
});

var TableHead = React.createClass({
    render: function() {
        return <div>Hello</div>;
    }
});

var TableBody = React.createClass({
    render: function() {
        return <div>Hello</div>;
    }
});


React.renderComponent(<Table rows={data.rows} cols={data.cols} />, document.body);