Question

我是Backbone.js的新手，但经过一些研究，我仍然无法找到问题的根源。

我正在开发一个应用程序，我有一组模型，我最终想要在视图中显示（一次只有一个模型）。

到目前为止，这是我的代码：

    var App = {
        Item: Backbone.Model.extend({
            defaults: function() {
                return {
                    id: -1,
                    name: '',
                    imageReference: '',
                    itemTags: []
                };
            },
            sync: function()  { return null; },
            fetch: function() { return null; },
            save: function()  { return null; }
        }),
        Items: Backbone.Collection.extend({
            model: this.Item,
        }),
        ItemView: Backbone.View.extend({
            el: "#itemdiv",
            tagName: "<div>",
            className: "item",
            template: _.template($("#template-item-view").html()),
            initialize: function(model) {
                this.model = model;
                this.listenTo(this.model, "change", this.render);
                this.render();
            },
            render: function() {
                this.$el.html(this.template(this.model.toJSON()));
                return this;
            },
        })
    };
    var items = new App.Items();
    items.add(new App.Item({name: "iPhone", id: 1, imageReference: "iPhone.jpg", ["mobile", "smartphone"]}));
    items.add(new App.Item({name: "MacBook", id: 2, imageReference: "MacBook.jpg", ["laptop", "computer"]}));

以上所有作品。当我检查items时，它有两个模型，包括参数。但是，当我尝试使用Collection.create()添加新项目时直接添加到集合中：

    items.create({name: "Apple Watch", id: 3, imageReference: "AppleWatch.jpg", ["watch", "redundant"]});

它会抛出错误：

TypeError: undefined is not a constructor (evaluating 'new this.model(attrs, options)')

如果它有帮助，这个错误出现在第915行（开发版）的Backbone.js中，包装函数是

/* from Backbone.js, Dev-Version, Line 911-919 */
_prepareModel: function(attrs, options) {
  if (attrs instanceof Model) return attrs;
  options = options ? _.clone(options) : {};
  options.collection = this;
  var model = new this.model(attrs, options);
  if (!model.validationError) return model;
  this.trigger('invalid', this, model.validationError, options);
  return false;
}

我无法弄清楚这只是一个小错误，还是我的架构错误。非常感谢您的帮助以及对最佳实践的评论等。

提前致谢！

Answer 1

您的添加行中有错误：

items.add(new App.Item({name: "iPhone", id: 1, imageReference: "iPhone.jpg", ["mobile", "smartphone"]}));
items.add(new App.Item({name: "MacBook", id: 2, imageReference: "MacBook.jpg", ["laptop", "computer"]}));

应该是：

items.add(new App.Item({name: "iPhone", id: 1, imageReference: "iPhone.jpg", itemTags: ["mobile", "smartphone"]}));
items.add(new App.Item({name: "MacBook", id: 2, imageReference: "MacBook.jpg", itemTags: ["laptop", "computer"]}));

字段itemTags丢失了。这样可以解决吗？

运行以下内容的时间点：

Items: Backbone.Collection.extend({
    model: this.Item,
}),

this尚不清楚。

因此，如果您使用命名空间封装代码，请执行以下任一操作之一：

var App = {}

App.item = Backbone.Model.extend({...})
App.items = Backbone.Collection.extend({...})
App.itemView = Backbone.View.extend({...})

App.items.add({})
App.items.add({})

或者：

(function() {
    var item = Backbone.Model.extend({...})
    var items = Backbone.Collection.extend({...})
    var itemView = Backbone.View.extend({...})

    var items.add({})
    var items.add({})
})()

Backbone.js将模型绑定到视图时出错

1 个答案: