无法在 document.eventListener 中定义此上下文

Question

我正在实施一个方案，在该方案中，在抽屉外单击时，我想执行 saveChange 操作，但不知何故它给我一个错误，即 saveChange 不是一个函数。我尝试了不同的方法来设置上下文，但它不起作用。

export default class DrawerModel {
    constructor(context) {
        this.data = context.primaryInfoData;
        this.name = ko.observable('test');
    
        document.addEventListener("click", function (e) {
            var self= this;
            var element = e.target;
            let isOutside = true;
            for (var element = e.target; element; element = element.parentNode) {
                if (element.id === 'drawer_primaryInfoDrawer') {
                   isOutside = false;
                }
            }
            if(isOutside) {
                    self.saveChanges();
            }           
            
        });
    }

    saveChanges() {
       const data = {
        title: this.name(),
       }
        this.data.valueChangeHandler(data);
    };

}

错误：

Uncaught TypeError: self.saveChanges is not a function

Answer 1

这是因为在您的事件侦听器中，this 指的是 window 而不是您的 class。您可以通过将 .bind(this) 添加到您的函数来解决此问题，如下所示：

document.addEventListener("click", function (e) {
    // ...
}.bind(this));

无法在 document.eventListener 中定义此上下文

Unable to define this context in document.eventListener

javascript

knockout.js