View.render()中的'this'被设置为模型

问题描述 投票:0回答:3

我是Backbone.js的新手

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

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

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

task.bind("change", _.bind(taskView.render, taskView));
javascript jquery backbone.js
3个回答
0
投票

在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。


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

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


0
投票

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

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

在你的情况下,

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

假设taskView是Backbone.ViewtaskBackbone.Model

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


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

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

在你的情况下:

task.on("change", taskView.render, taskView);
© www.soinside.com 2019 - 2024. All rights reserved.