ReactJS Mixin Method Override
How can I create a method on a ReactJS Mixin such that I'm allowed to override it in the Component definition?
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 MyMixin = {
render: function() {
return this.renderItem();
}
};
var Hello = React.createClass({
mixins: [MyMixin],
renderItem: function() {
return <div > Hey {
this.props.name
} < /div>;
}
});
React.renderComponent( < Hello name = "World" / > , document.body);
// Notice in the console an error is logged:
/*
Uncaught Error: Invariant Violation: ReactCompositeComponentInterface: You are attempting to define `renderItem` on your component more than once. This conflict may be due to a mixin.
*/