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

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-10-26 13:03:51  来源:igfitidea点击:

Passing arguments to a backbone view

javascriptcollectionsbackbone.jsviews

提问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 });