I am attempting to dynamically enhance the render function of a Backbone.js view. My goal is to trigger an event both before and after the render function is called. I have experimented with overriding the function and invoking the old function, which does work, but it results in all models that are bound to the render function losing their bindings. The current code I am using is as follows, where I provide a created Backbone.js view:
function extendRender(view) {
view.render = (function() {
var cachedRender = view.render;
return function() {
console.log("before render");
cachedRender.apply(this, arguments);
console.log("after render");
};
}());
}
While the above code functions properly, it causes issues with any models that are bound to the render function using:
this.model.on('change', this.render, this);
This set up breaks these bindings. The only workaround I have discovered is to rebind the .on('change') event of the model after the function override. However, not every view's model will be bound in this specific way. Any guidance on this matter would be greatly appreciated! Thank you!