希望我遗漏了一些简单的东西...我正在尝试做一些基本的事情,因为我希望视图的属性哈希在模型更改时自动更新。
如果你看一下属性:部分,你可以看到我是如何动态设置它们的。但是,它们似乎没有更新基础模型更改。
有什么想法吗?谢谢!
NS.CP.ColorView = Backbone.View.extend({
initialize: function(){
_.bindAll(this);
this.model.bind('change', this.render);
},
attributes: function(){
return {
'class': (this.model.get('active') == 'true') ? 'active' : '',
'data-code': this.model.get('modifier'),
'data-hex': this.model.get('color'),
'data-image': this.model.get('image'),
'data-match': this.model.get('matchBody'),
'style': 'background-color: ' + this.model.get('color')
};
},
events: {
'click': 'renderFrame',
'activate': 'activate',
'deactivate': 'deactivate'
},
tagName: 'li',
render: function(){
console.log(this);
var $el = this.$el;
if( this.model.get('active') == 'true' && $el.closest('.model_colorpicker').hasClass('body-colors') ){
// Change border color on click
$('.color-frame').css( 'border-color', $el.data('hex') );
}
return this.el;
},
activate: function(){
this.model.set('active', 'true');
},
deactivate: function(){
this.model.set('active', 'false');
},
renderFrame: function(){
if( !this.$el.hasClass('active') ){ this.$el.trigger('activate').siblings().trigger('deactivate'); }
else { this.$el.trigger('deactivate'); }
}
});
答案 0 :(得分:6)
计算属性哈希的唯一时间是创建视图时,您需要自己做一些工作来更新它,这是一种方法,
initialize : function(){
this.listenTo(this.model, 'change', this.modelChange);
},
modelChange : function(){
this.$el.attr(_.extend({}, _.result(this, 'attributes')));
}