在视图之间制作动画

时间:2012-12-23 12:40:41

标签: backbone.js requirejs

在我的每个观点中,我在每个render方法上都有这个:

render: function(){
    template = _.template(ViewTemplate, {foo:get});
    wrapper = this.$el;
    wrapper.is(':hidden') ? 
    wrapper.html(template).show(200) : 
    wrapper.hide(200, function(){ wrapper.html(template).show(200) });
}

但这是如此重复,我想知道如何在我的视图之间实现动画,而不是重复相同的代码行?

1 个答案:

答案 0 :(得分:5)

也许只是将淡入作为实用程序方法添加到View原型中:

Backbone.View.prototype.fadeIn = function(template, wrapper) {
    wrapper.is(':hidden') ? 
    wrapper.html(template).show(200) : 
    wrapper.hide(200, function(){ wrapper.html(template).show(200) });
};

这减少了render实施中的重复:

render: function() {
    template = _.template(ViewTemplate, {foo:get});
    this.fadeIn(template, this.$el);
}