View.render（）中的'this'被设置为模型

Posted 2021-05-05

我是Backbone.js的新手

我一定是在做错事。我正在尝试做一个小小的演示，看看我可以用Backbone做些什么，并将其基于一些示例代码。

我得到“未捕获的TypeError：无法调用未定义的方法toJSON”。

我明白为什么会这样做，因为.bind("change", taskView.render)调用正在为模型设置上下文（警报确认），但似乎至少应该有一个参数来使渲染函数能够访问视图。也许我只是走错路？ （参见下面的示例代码）。

task.bind("change", _.bind(taskView.render, taskView));

答案

在Backbone Views和Models中，'bind'的'this'上下文是调用对象，因此对于model.bind('change', ...) this来说是模型。对于view.bind(...，this将是观点。

您收到错误是因为task.bind("change", _.bind(taskView.render, taskView));在渲染运行时将this设置为任务，但this实际上需要是taskView。

由于你想将模型事件绑定到视图，正如irvani所建议的，最好的方法是使用.listenTo方法（参见：http://backbonejs.org/#Events-listenTo）

taskView.listenTo(task, 'change', taskView.render);

根据您希望视图生命周期的工作方式，您还可以将代码放在视图的initialize方法中，该方法在创建视图时执行。然后在stopListening方法中使用remove，以便在视图不再使用时清除侦听器。

当任务模型传递到视图中时，您会得到一个相当简洁的：

AskView = Backbone.Model.extend({
    initialize: function(){
        this.listenTo(this.model, 'change', this.render);
    },
    ...
    remove: function(){
        this.stopListening(this.model);
        ...
    }
 });

 var askView = new AskView({ model: task });

但是，您问题的一线解决方案是：

 task.on("change", taskView.render, taskView);

bind只是on的别名（参见：http://backbonejs.org/#Events-on）。第一个参数是您正在侦听的事件，第二个参数是要触发的方法，第三个参数是要绑定到的上下文，在本例中是您的taskView。

另一答案

task.listenTo(model, 'change', taskView.render);

这表示听取模型更改并在每次更改时呈现taskView。

另一答案

正如irvani建议的那样，使用listenTo代替。

object.listenTo(other, event, callback)告诉对象在另一个对象上侦听特定事件。使用此表单而不是other.on（事件，回调，对象）的优点是listenTo允许对象跟踪事件，并且可以稍后将它们全部删除。将始终使用object作为上下文调用回调。

在你的情况下，

taskView.listenTo(task,"change",taskView.render);

假设taskView是Backbone.View而task是Backbone.Model。

与使用listenTo相比，使用on时内存泄漏的可能性会更小。

---

如果你必须使用on，你可以指定上下文作为第三个参数，并且mu太短建议：

要在调用回调时为此提供上下文值，请传递可选的最后一个参数：model.on('change', this.render, this)或model.on({change: this.render}, this)。

在你的情况下：

task.on("change", taskView.render, taskView);