• Jobs
  • About Us
  • professionals
    • Home
    • Jobs
    • Courses and challenges
  • business
    • Home
    • Post vacancy
    • Our process
    • Pricing
    • Assessments
    • Payroll
    • Blog
    • Sales
    • Salary Calculator

0

174
Views
RemoveEventListener de Javascript no funciona

Ya probé algunas soluciones, como que las funciones de devolución de llamada son las mismas. Todavía no puedo hacer que funcione.

La función removeClickEventHandler dentro del módulo de vista no funciona. El detector de eventos se aplica desde el controlador. Abstraí algo de código del módulo de vista pero dejé el módulo del controlador como está.

Código del controlador:

 import navigationView from "./view/navView.js"; import ticTacToeView from "./view/ticTacToeView.js"; import ticTacModule from "./modules/ticTacModule.js"; class Controller { constructor() { navigationView.addHoverEventHandlers(navigationView.hoverFunction); navigationView.addClickHandler(this.showContent.bind(this)); } showContent() { ticTacToeView.renderContent(navigationView.clickedContent); ticTacToeView.addClickEventHandler(this.ticTacToeControl.bind(this)); ticTacToeView.addHoverHandler(ticTacToeView.hoverFunction); } ticTacToeControl(clickedBox) { if (ticTacToeView.checkIfBoxEmpty(clickedBox)) { ticTacToeView.createMark(clickedBox, ticTacModule.activePlayer); ticTacModule.updateBoardState(clickedBox); ticTacModule.changeActivePlayer(); ticTacToeView.highlightActivePlayer(ticTacModule.activePlayer); ticTacModule.checkForWinner(); if (ticTacModule.winner) { ticTacToeView.renderWinner(ticTacModule.winner); ticTacToeView.removeClickEventHandler(this.ticTacToeControl); } } } }

Este es el código del módulo de vista:

 import View from "./View.js"; class TicTacToeView extends View { addClickEventHandler(fn) { const ticTacContainer = document.querySelector(".tic-tac-toe"); ticTacContainer.addEventListener("click", fn, true); } removeClickEventHandler(fn) { const ticTacContainer = document.querySelector(".tic-tac-toe"); ticTacContainer.removeEventListener("click", fn, true); } } export default new TicTacToeView();
about 3 years ago · Juan Pablo Isaza
1 answers
Answer question

0

bind crea una nueva función con una nueva referencia. this.ticTacToeControl y this.ticTacToeControl.bind(this) son dos funciones diferentes con dos referencias diferentes. Almacene la referencia de la función en una variable y utilícela para eliminar el detector de eventos.

 class Controller { constructor() { navigationView.addHoverEventHandlers(navigationView.hoverFunction); navigationView.addClickHandler(this.showContent.bind(this)); } showContent() { ticTacToeView.renderContent(navigationView.clickedContent); this.handler = this.ticTacToeControl.bind(this); ticTacToeView.addClickEventHandler(this.handler); ticTacToeView.addHoverHandler(ticTacToeView.hoverFunction); } ticTacToeControl(clickedBox) { if (ticTacToeView.checkIfBoxEmpty(clickedBox)) { ticTacToeView.createMark(clickedBox, ticTacModule.activePlayer); ticTacModule.updateBoardState(clickedBox); ticTacModule.changeActivePlayer(); ticTacToeView.highlightActivePlayer(ticTacModule.activePlayer); ticTacModule.checkForWinner(); if (ticTacModule.winner) { ticTacToeView.renderWinner(ticTacModule.winner); ticTacToeView.removeClickEventHandler(this.handler); } } } }
about 3 years ago · Juan Pablo Isaza Report
Answer question
Find remote jobs

Discover the new way to find a job!

Top jobs
Top job categories
Business
Post vacancy Pricing Our process Sales
Legal
Terms and conditions Privacy policy
© 2025 PeakU Inc. All Rights Reserved.

Andres GPT

Recommend me some offers
I have an error