Skip to content

Instantly share code, notes, and snippets.

@thegoleffect
Created May 14, 2014 15:13
Show Gist options
  • Save thegoleffect/fbb00ba82c6394a026ee to your computer and use it in GitHub Desktop.
Save thegoleffect/fbb00ba82c6394a026ee to your computer and use it in GitHub Desktop.
define([
], function() {
return {
componentDidMount: function() {
this._boundForceUpdate = this.forceUpdate.bind(this, null);
this.getBackboneObject().on("all", this._boundForceUpdate, this);
},
componentWillUnmount: function() {
this.getBackboneObject().off("all", this._boundForceUpdate);
},
getBackboneObject: function() {
return this.props.collection || this.props.model;
}
};
});
/** @jsx React.DOM */
define([
"Backbone",
"React",
"ListComponent"
], function(React, ListComponent) {
var ListItem = Backbone.Model.extend({});
var ListItemCollection = Backbone.Collection.extend({
model: ListItem
});
var listItemCollection = new ListItemCollection();
React.renderComponent(
<ListComponent collection={listItemCollection} />,
document.body
);
listItemCollection.set([
new ListItem(),
new ListItem(),
new ListItem()
]);
});
/** @jsx React.DOM */
define([
"React",
"BackboneMixin"
], function(React, BackboneMixin) {
return React.createClass({
mixins: [BackboneMixin],
render: function() {
var listItems = this.props.collection.map(function(model) {
return (<li key={model.cid}>{model.cid}</li>);
});
return (
<ul>
{listItems}
</ul>
);
}
});
});
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment