Question

在本视频教程的第22:30，https://www.youtube.com/watch?v=hBVYDVy3QNI，作者在coffeescript中做了一些我无法翻译为Javascript的内容。他使用胖箭头在内部回调中维护自定义区域的上下文。因此，他可以在一个对话关闭回调中调用该区域的近距离？我如何在Javascript中执行此操作？

这是我的自定义区域尝试，但它在调用this.closeDialog（）时失败，因为＆＃34;这个＆＃34;是指对话而不是区域：

    var DialogRegion = Backbone.Marionette.Region.extend({

        onShow: function (view) {
            this.$el.dialog({
                modal: true,
                resizable: false,
                draggable: false,
                width: "600px",
                close: function (e, ui) {
                        this.closeDialog()//This doesn't work.  Wrong context.  Need outer DialogRegion context?                
                }
            })
        },        

        closeDialog: function () {
            this.close();
            this.$el.dialog("destroy");
        }

    });

Answer 1

如果你可以假设一个相当现代的JavaScript，那么你可以使用Function.prototype.bind：

bind()方法创建一个新函数，在调用时，将其this关键字设置为提供的值[...]

看起来像这样：

close: function (e, ui) {
    this.closeDialog();
}.bind(this)

您正在使用Marionette，因此您使用的是Backbone，这意味着可以使用Underscore。这意味着如果您不想使用原生bind，则可以使用_.bind：

close: _(function (e, ui) {
    this.closeDialog();
}).bind(this)

您正在使用jQuery-UI，因此您也应该使用$.proxy。 $.proxy与_.bind具有相同的目的，因此您可以使用它：

close: $.proxy(function(e, ui) {
    this.closeDialog();
}, this)

“经典”选项是elclanrs在评论中提到的选项：

onShow: function (view) {
    var _this = this;
    this.$el.dialog({
        //...
        close: function (e, ui) {
            _this.closeDialog()
        }
    });
}

所有这四个功能都与您在CoffeeScript视频中看到的close: (e, ui) => ...功能相同。

Marionette js - 在我定制的这个自定义区域中，coffeescript的胖箭如何转换为Javascript？

1 个答案: