React Base Fiddle (JSX)

Starting point for creating JSFiddles with React. This uses React with Addons.

by chrisbenseler

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/react/0.13.1/JSXTransformer.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/0.13.1/react-with-addons.js"></script>
<script src="https://facebook.github.io/react/js/jsfiddle-integration.js"></script>

<div id="container">
    <!-- This element's contents will be replaced with your component. -->
</div>

JavaScript 1.7

var MMCafeReact = MMCafeReact || {};

MMCafeReact.List = React.createClass({

	render: function() {

        var items = this.props.items.map(function(item, index) {
        	if(item.link) {
            	var target = item.external ? "_blank" : "";
            	return <li key={ "item_" + index }><a href={ item.link } target={ target } dangerouslySetInnerHTML={{ __html: item.text  }}></a></li>
            }            
            else
	        	return <li key={ "item_" + index } dangerouslySetInnerHTML={{ __html: item.text  }}></li>
        });
        return <ul className={ this.props.className }>
        	{ items }
        </ul>;
	}

});

var List = MMCafeReact.List;

var items = [
	{ 
    	text: "link externo",
        link: "http://www.google.com",
        external: true
    },
    { 
    	text: "link interno",
        link: "http://www.google.com",
        external: false
    },
    { 
    	text: "texto"
    },
];

var list = <List items={ items } className="teste" />;

React.render(list, document.getElementById('container'));