JSFiddle - React, Tailwind, and code Playground
HTML
<script src="http://fb.me/JSXTransformer-0.5.1.js"></script>
<script src="http://fb.me/react-with-addons-0.5.1.js"></script>
<script src="http://code.jquery.com/jquery-1.10.1.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/underscore.js/1.5.2/underscore-min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/backbone.js/1.1.0/backbone-min.js"></script>
<script src="http://fb.me/react-js-fiddle-integration.js"></script>
<body>
</body>
JavaScript 1.7
/** @jsx React.DOM */
/* global React, Backbone, $ */
var MyWidget = React.createClass({
render: function() {
return (
<a href="#" onClick={this.props.handleClick}>Do something!</a>
);
}
});
var MyView = Backbone.View.extend({
el: 'body',
template: '<div class="widget-container"></div>' +
'<div class="outside-container"></div>',
render: function() {
this.$el.html(this.template);
React.renderComponent(new MyWidget({
handleClick: this.clickHandler.bind(this)
}), this.$('.widget-container').get(0));
return this;
},
clickHandler: function() {
this.$(".outside-container").html("The link was clicked!");
}
});
new MyView().render();