javascript 在 Backbone 中 this.model 是未定义的，为什么？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/14866402/
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
In Backbone this.model is undefined, why?
提问by Shaoz
I've looked everywhere for an answer but wasn't satisfied with what I've found.
我到处寻找答案，但对我的发现并不满意。
The issue is, I'm doing a tutorial from Addy Osmani to make a 'Todo' app in Backbone, but when I look at the console, I get an error saying that this.model is undefined.
问题是，我正在做一个来自 Addy Osmani 的教程，以在 Backbone 中制作一个“Todo”应用程序，但是当我查看控制台时，我收到一个错误提示this.model is undefined。
I even tried this SO answer Backbone model error displayed in console, but I still get the same error. Please tell me what is wrong.
我什至尝试了控制台中显示的SO answer Backbone model error，但我仍然遇到相同的错误。请告诉我出了什么问题。
By the way, what are this.modelor this.collection? I've got an idea that they refer to Backbone.Modeland Backbone.Collectionbut how do they work? I'm asking this because in another tutorial this.collectionand this.model.modelswere also undefined, when I've clearly defined the Modeland Collection.
顺便说一句，什么是this.model或this.collection？我有一个想法，他们参考Backbone.Model和Backbone.Collection，但他们怎么工作的？我问这个是因为在另一个教程中this.collection并且this.model.models也未定义，当我清楚地定义了Model和Collection。
Many Thanks
非常感谢
JS:
JS：
//Model
var Todo = Backbone.Model.extend({
defaults: {
title: 'Enter title here',
completed: true
},
validate: function(attrs) {
if (attrs.title === undefined) {
return 'Remember to enter a title';
}
},
initialize: function() {
console.log('This model has been initialized');
this.on('change:title', function() {
console.log('-Title values for this model have changed');
});
this.on('invalid', function(model, error) {
console.log(error);
});
}
});
//View
var TodoView = Backbone.View.extend({
el: '#todo',
tagName: 'li',
template: _.template($('#todoTemplate').html()),
events: {
'dbclick label': 'edit',
'click .edit': 'updateOnEnter',
'blur .edit': 'close'
},
initialize: function() {
_.bindAll(this, 'render');
this.render();
},
render: function() {
this.$el.html(this.template(this.model.toJSON()));
this.input = this.$('.edit');
console.log(this.model.toJSON());
return this;
},
edit: function() {
//do something...
},
close: function() {
//do something...
},
updateOnEnter: function() {
//do something...
}
});
var todoview = new TodoView();
console.log(todoview.el);
//Collection
var TodoList = Backbone.Collection.extend({
model: Todo
});
回答by Eric Levine
You need to instantiate a Modelor Collectionand pass it to your View. Otherwise, when the render method is called on your TodoView, this.modelwill be null.
您需要实例化一个ModelorCollection并将其传递给您的视图。否则，当在 TodoView 上调用 render 方法时，this.model将为空。
For example, try rearranging the last few lines of your code like this:
例如，尝试像这样重新排列代码的最后几行：
//Collection
var TodoList = Backbone.Collection.extend({
model: Todo
});
var todos = new TodoList();
var todoview = new TodoView({model: todos});
From that point onward, you can modify todos (which is a Collection) and your view can listen to todos' events and re-render accordingly.
从那时起，您可以修改 todos（即 a Collection）并且您的视图可以监听 todos 的事件并相应地重新渲染。
回答by Recurse
You didn't say, but I assume the error you are getting is occurring in the render() method.
你没有说，但我假设你得到的错误发生在 render() 方法中。
Your problem is that you define a new type of model (var Todo = Backbone.Model.extend({...) however you never instantiate it, nor do you pass the model to the todoview constructor.
您的问题是您定义了一种新类型的模型 ( var Todo = Backbone.Model.extend({...) 但是您从未实例化它，也没有将模型传递给 todoview 构造函数。
So at the very least you need to do:
所以至少你需要做：
var todomodel = new Todo();
var todoview = new TodoView({
model: todomodel
});
回答by satchmorun
The answer in the other question is the answer to your question: you're not passing the model to the view when you instantiate the view.
另一个问题的答案是您的问题的答案：实例化视图时，您没有将模型传递给视图。
var model = new Todo();
var todoview = new TodoView({model: model});
When you pass an object to a view's constructor, it looks for certain keys and attaches them directly to the view.
当您将对象传递给视图的构造函数时，它会查找某些键并将它们直接附加到视图。
You can see which by looking at Backbone's sourceand searching for viewOptions.
您可以通过查看Backbone 的来源并搜索viewOptions.
That's how you get the this.modeland this.collectionautomatically attached to the view's this.
这就是你如何获得this.model并this.collection自动附加到视图的this.
