在下面的Layout中,我添加了一个CollectionView来显示onRender中的SELECT列表.紧接着,我使用ui哈希来启用或禁用视图中的所有控件.这不适用于新App.View.Categories生成的SELECT.
应该是？或者UI哈希不适用于布局中的区域？
App.View.UploadFile = Backbone.Marionette.Layout.extend({
template: '#upload-file-template',regions:{
category: 'td:nth-child(4)'
},ui:{
inputs: 'textarea,select,.save'
},onRender: function(){
this.category.show(
new App.View.Categories({
collection: App.collection.categories
}) // generates the SELECT list
);
console.log(this.ui.inputs); // Length 2. Missing select.
console.log(this.$('textarea,.save')); // Length 3
this.ui.inputs.prop(
'disabled',(this.model.get('upload_status')!='staged')
);
}
});
解决方法
这应该按照您期望的方式工作. Marionette源中的代码在这里：
https://github.com/marionettejs/backbone.marionette/blob/master/src/marionette.itemview.js#L49-L51
对bindUIElements()的调用将ui散列转换为jQuery选择器对象,并在调用onRender方法之前调用它.
你看到错误吗？或者选择器什么都不返回,对元素没有影响？
更新：
啊!当然……我没有足够关注你的代码.你是正确的,因为UI元素选择器发生在你将子视图添加到区域之前.我以前从未遇到过这种情况……但这似乎是我们想要修复/支持的事情.
目前,我建议的最好的解决方法是调用’this.bindUIElements();’在你的onRender方法的最后.这将强制ui元素重新绑定到选择器.
我还要在github问题列表中添加一个问题,以便为此寻找更好的解决方案.我不知道什么时候能够达到这一目标,但这至少会将其列入要修复的事项列表中.