从回调中访问`this`

时间:2012-12-29 11:40:14

标签: javascript backbone.js scope callback

此处已经问过How do I trigger the success callback on a model.save()?类似的问题,但仍然没有回答如何从回调中触发事件。

所以这里是我的代码中的success回调,其中我想调用addOne事件来呈现已保存的注释。除this.addOne(receivedItem);外,一切正常 - 我无法在回调中使用this来触发此事件。其他地方 - 我可以。

如何解决这个问题?

CommentsListView = Backbone.View.extend({
    ...
    addOne: function (item) {
        var commentView = new CommentView({
            model: item
        });
        this.$el.append(commentView.render().el);
    },
    addNewComment: function (event) {
        var item = {
            post_id: this.$('#post_id').val(),
            text: this.$('#text').val()
        };
        var commentItem = new CommentItem();
        commentItem.save({'model':item}, { 
            success: function(receivedItem, response) {
                this.addOne(receivedItem); // Uncaught TypeError: Object [object Window] has no method 'addOne'.
            }
        }, this);
    }
});

2 个答案:

答案 0 :(得分:7)

这是因为成功回调的范围不同,而this并未指向您的观点 要快速解决此问题,只需引用this并改为使用它:

var self = this;
commentItem.save({'model':item}, { 
    success: function(receivedItem, response) {
        self.addOne(receivedItem); // works
    }
});

或者您可以使用下划线的bind方法将不同的上下文绑定到函数:

success : _.bind(function(receivedItem, response) {
    this.addOne(receivedItem); 
}, this)

答案 1 :(得分:0)

这可能是一个迟到的答案。但会帮助那些正在寻找它的人。这是从settimeout回调

访问'this'关键字
CommentsListView = Backbone.View.extend({
...
    addOne: function (item) {
        // DO Stuff
    },
    addNewComment: _.bind(function (event) {
        setTimeout(_.bind(function(){ 
            this.addOne(/*receivedItem*/);
        }, this), 1000);
    }, this)
});