Как передать объект в событие? Здравствуйте. Есть класс. В нем идет обработка событий. Как сделать чтоб при срабатывании события можно было нормально работать с классом?
Вот такая штука не вариантthis.canvas_object.addEventListener("click", function() { this.click(this); }, false);class Canvas{

constructor(canvas_id) {
this.canvas_object = document.getElementById(canvas_id);
this.ctx = this.canvas_object.getContext('2d');
this.canvas_object.addEventListener("click", this.click, false); // Слушаем события
}

click (){
console.log('нажал');
this.ctx.fillStyle = "green";
this.ctx.fillRect(50, 50, 100, 100);
// Вот здесь нужны данные объекта
// Понятно что this не работает, но нужно как то передать этот объект. Есть варианты?
}
}

21 Авг 2019 в 07:01
220 +1
0
Ответы
1

Для того чтобы передать объект в обработчик события, вы можете использовать стрелочную функцию, которая сохраняет контекст выполнения. В вашем случае, вы можете модифицировать код следующим образом:

this.canvas_object.addEventListener("click", () => { this.click() }, false);
class Canvas{
constructor(canvas_id) {
this.canvas_object = document.getElementById(canvas_id);
this.ctx = this.canvas_object.getContext('2d');
this.canvas_object.addEventListener("click", () => { this.click() }, false); // Слушаем события
}
click (){
console.log('нажал');
this.ctx.fillStyle = "green";
this.ctx.fillRect(50, 50, 100, 100);
// Теперь объект доступен через this
}
}

Теперь при срабатывании события click будет вызываться метод click объекта Canvas, и внутри этого метода вы сможете нормально работать с объектом и его свойствами.

20 Апр 2024 в 13:09
Не можешь разобраться в этой теме?
Обратись за помощью к экспертам
Гарантированные бесплатные доработки в течение 1 года
Быстрое выполнение от 2 часов
Проверка работы на плагиат
Поможем написать учебную работу
Прямой эфир