刚刚开始使用 Backbone。我有一个通用 View ,可以将集合呈现为带有标题的列表。我目前正在将集合和标题传递给渲染方法,但这似乎有点奇怪。还有其他更规范的方式吗?
例如:
var ListView = Backbone.View.extend({
template: _.template([
"<div>",
"<% if (title) { %><h2><%= title %></h2> <% } %>",
"<% if (items.length > 0) { %>",
"<ul>",
"<% items.each(function(item) { %>",
"<%= itemTemplate(item) %>",
"<% }); %>",
"</ul>",
"<% } else { %><p>None.</p><% } %>",
"</div>"
].join('')),
itemTemplate: _.template(
"<li><%= attributes.name %> (<%= id %>)</li>"
),
render: function(items, title) {
var html = this.template({
items: items /* a collection */,
title : title || '',
itemTemplate: this.itemTemplate
});
$(this.el).append(html);
}
});
var myView = new ListView({ el: $('#target') });
myView.render(myThings, 'My Things');
myView.render(otherThings, 'Other Things');
最佳答案
您应该在 initialize()
函数中传递属性:
initialize: function (attrs) {
this.options = attrs;
}
所以在这里您可以将属性作为对象传递,如下所示:
new MyView({
some: "something",
that: "something else"
})
现在您可以在 this.options 中的整个实例中访问您传递的值
console.log(this.options.some) # "something"
console.log(this.options.that) # "something else"
要传递一个集合,我建议制作一个父 View 和一个 subview :
var View;
var Subview;
View = Backbone.View.extend({
initialize: function() {
try {
if (!(this.collection instanceof Backbone.Collection)) {
throw new typeError("this.collection not instanceof Backbone.Collection")
}
this.subViews = [];
this.collection.forEach(function (model) {
this.subViews.push(new SubView({model: model}));
});
} catch (e) {
console.error(e)
}
},
render: function() {
this.subViews.forEach(function (view) {
this.$el.append(view.render().$el);
}, this);
return this;
}
});
SubView = Backbone.View.extend({
initialize: function () {
try {
if (!(this.model instanceof Backbone.model)) {
throw new typeError("this.collection not instanceof Backbone.Collection")
}
} catch (e) {
console.error(e);
}
},
render: function () {
return this;
}
});
testCollection = new MyCollection();
collectionView = new View({collection: testCollection});
$("body").html(collectionView.render().$el);
您应该始终处理集合的模型,而不仅仅是集合的数据。
关于javascript - 将参数传递给主干 View ,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/11402973/