javascript 将参数传递给主干视图
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/11402973/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Passing arguments to a backbone view
提问by sprugman
Just getting started with Backbone. I have a generic view that can render a collection as a list with a title. I'm currently passing the collection and title into the render method, but that seems a bit odd. Is there another way that's more canonical?
刚刚开始使用 Backbone。我有一个通用视图,可以将集合呈现为带有标题的列表。我目前正在将集合和标题传递给渲染方法,但这似乎有点奇怪。还有另一种更规范的方式吗?
E.g.:
例如:
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');
回答by Austin
You should pass attributes in the initialize()
function:
您应该在initialize()
函数中传递属性:
initialize: function (attrs) {
this.options = attrs;
}
So here you would pass the attributes as an object, like so:
因此,在这里您可以将属性作为对象传递,如下所示:
new MyView({
some: "something",
that: "something else"
})
Now you have the values that you passed in accessible throughout this instance, in this.options
现在,在 this.options 中,您可以在整个实例中访问传递的值
console.log(this.options.some) # "something"
console.log(this.options.that) # "something else"
To pass in a collection, I recommend making one parent view and one 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);
You should alwayshandle the Models of a Collection, not just the data of the collection.
您应该始终处理集合的模型,而不仅仅是集合的数据。
回答by algiecas
You should have a modelfor your viewand access model's properties when rendering the view.
你应该有一个模型为您的视图渲染视图和访问模型的属性。
var myModel = new Backbone.Model();
myModel.set("myThings", myThings);
myModel.set("myOtherThings", myOtherThings);
var myView = new ListView({ model: myModel });