olay dinleyicisi pencereden ayarlanmış bir olay dinleyicisi kaldırmak gerekir

Question

kaldırmaz, ancak çalışmıyor. Dinleyiciyi lodash'ın gaz kelebeği ile ve olmadan ayarlamaya çalıştım ama hiçbir fark yaratmıyor. İşte benim kod:

handler() { 
    if (this.options.url === undefined) {throw new Error('no url specified');} 
    if (InfiniteScroll.isElementInViewport(this.elementToWatch)) { 
     Promise.resolve(this.removeListener()) 
      .then(val => { 
       this[this.options.transport](); 
      }); 
    } 
} 

ya bir fark yaratmak değildi:

setupListener() { 
    window.addEventListener('resize', _.throttle(this.handler.bind(this), 750)); 
    window.addEventListener('scroll', _.throttle(this.handler.bind(this), 750)); 
} 

removeListener() { 
    window.removeEventListener('resize', _.throttle(this.handler.bind(this), 750)); 
    window.removeEventListener('scroll', _.throttle(this.handler.bind(this), 750)); 
    window.addEventListener('load', this.handler.bind(this), false); 
} 

static isElementInViewport (el) { 
    let rect = el.getBoundingClientRect(); 
    return (
     rect.bottom <= (window.innerHeight || document.documentElement.clientHeight) && 
     rect.right <= (window.innerWidth || document.documentElement.clientWidth) 
    ); 
} 

handler() { 
    if (this.options.url === undefined) {throw new Error('no url specified');} 
    if (InfiniteScroll.isElementInViewport(this.elementToWatch)) { 
     this.removeListener(); 
     this[this.options.transport](); 
    } 
} 

Ben de kaldırılmasını promisify çalıştık.

ilerleyen kodda, ben dinleyicileri yeniden atamak istiyorum:

handleResponse(data) { 
     console.log('handleResponse' + data); 
     Promise.resolve(this.addElementsToDOM(data)) 
      .delay(1000) 
      .then(() => { 
       this.page++; 
       this.elementToWatch = document.getElementById(this.element).rows[document.getElementById(this.element).rows.length - this.options.loadTiming]; 
       //this.setupListener(); 
      }); 
    } 

ben her adımını açmış ve bunun nedenini bulamadı ettik. Birisi yardım edebilir mi?

Sidenote: kaldırmak ve dinleyicilere her zaman eklemek için daha kaydırma olayını ele almanın daha iyi bir yolu var mı?

Answer 1

şey şudur: bir olay dinleyicisi eklerken, tarayıcı onun 'anahtar' parametre olarak geçiyoruz function referans olarak kaydeder. Yani, onu kaldırmak istediğinizde, bu referansı göndermelisiniz.

sorunu çözmek için iki yol vardır. İlk adlandırılmış işlevleri oluşturmaktır:

setupListener() { 
    this.listener = function() { 
    _.throttle(this.handler.bind(this), 750); 
    }.bind(this); 

    window.addEventListener('resize', this.listener); 
    window.addEventListener('scroll', this.listener); 
} 

removeListener() { 
    window.removeEventListener('resize', this.listener); 
    window.removeEventListener('scroll', this.listener); 
    window.addEventListener('load', this.handler.bind(this), false); 
} 

diğer Pencere addEventListener yöntemini geçersiz kılarak, ama bunu yapmak için önermiyoruz.