На странице есть много похожих друг на друга модальных окон, каждый из которых открывается/закрывается своей кнопкой, решил сделать для них класс
class Modal {
constructor(modalSelector, openBtnSelector, closeBtnSelector) {
this._modal = document.querySelector(modalSelector);
this._openBtn = document.querySelector(openBtnSelector);
this._closeBtn = this._modal.querySelector(closeBtnSelector);
}
openModal() {
this._modal.classList.add('show');
document.body.classList.add('open-modal');
this._closeBtn.addEventListener('click', this.closeModal);
}
closeModal() {
this._modal.classList.remove('show');
document.body.classList.remove('open-modal');
this._closeBtn.removeEventListener('click', this.closeModal);
}
addOpenEvent () {
this._openBtn.addEventListener('click', this.openModal);
}
}
столкнулся с такой проблемой: если передавать лишь ссылку на функцию, как в коде выше
this.openModal, то при клике на кнопку выдает ошибку, что this._modal undefined, если в обработчик события коллбэком передавать стрелочную анонимную
()=> this.openModal(), то в таком случае все работает хорошо, модальное окно нормально открывается и закрывается, но из-за того что передается анонимная функция removeEventListener не отрабатывает и не удаляет обработчик с кнопки закрытия. подскажите пожалуйста, как пофиксить, что бы ненужный обработчик удалялся при закрытии
