JSFiddle - React, Tailwind, and code Playground

by koba04

HTML

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

JavaScript 1.7

var Hello = React.createClass({
  getInitialState: function() {
    return {
      items: [
        { id: 1, name: "foo", flagged: false },
        { id: 2, name: "bar", flagged: true },
        { id: 3, name: "baz", flagged: false }
      ]
    };
  },
  onClick: function() {
      this.state.items[0].flagged = true;
      this.setState({items: this.state.items});  
  },
  render: function() {
    var items = this.state.items
    .filter(function(item) { return item.flagged })
    .map(function(item) { return <li key={item.id}>{item.name}</li> })
    ;
    return <div>
      <button onClick={this.onClick}>click</button>
      <ul>{items}</ul>
    </div>
  }
});


 
React.render(<Hello />, document.body);