0
스크롤을 수신하는 함수가 있지만 여러 번 호출해야합니다. 그리고 이로 인해 이벤트 리스너가 스태킹됩니다. 그래서 다음과 같이 추가하기 전에 하나를 제거하려고 :eventListener를 제거 할 수 없습니다.
watchButton() {
console.log('watching button');
const button = document.getElementById('load-more-news');
const fetcher =() => {
let windowHeight = document.body.offsetHeight/2;
let offset = button.getBoundingClientRect().top;
if (offset <= windowHeight) {
button.click();
}
};
window.removeEventListener('scroll', throttle(fetcher, CONFIG.THROTTLE), true);
window.addEventListener('scroll', throttle(fetcher, CONFIG.THROTTLE), true);
}
나는 또한 다른 변수에 throttle
기능을 결합 시도 :
const fetcher =() => {
let windowHeight = document.body.offsetHeight/2;
let offset = button.getBoundingClientRect().top;
if (offset <= windowHeight) {
button.click();
}
};
const boundFetcher = throttle(fetcher, CONFIG.THROTTLE);
window.removeEventListener('scroll', boundFetcher, true);
window.addEventListener('scroll', boundFetcher, true);
하지만 크롬에서 이벤트 리스너 탭을 확인할 때, 나는 두가 (이상) 스크롤 리스너가 여기에 초기화됩니다. 어떻게해야합니까?
외부에서
const
변수를 이동
에 여러 통화에서 당신의 변수가 일정하지 않습니다 ... 그래서 그것은 제거되지 않습니다. –watchButton
['removeEventListener'] (https://developer.mozilla.org/en-US/docs/Web/API/EventTarget/removeEventListener)에는'addEventListener'와 함께 사용 된 원래의 함수 참조가 필요합니다. 그래서'throttle'이 isn 그 다음에는 제거되지 않을 것입니다. –
@PatrickEvans throttle은 이벤트 처리기가 너무 자주 실행되는 것을 방지하는 잘 알려진 함수 데코레이터이며, 대부분의 주요 js 라이브러리에서 밑줄처럼 사용됩니다. 진단 결과가 정확하면 새로운 함수 객체를 반환합니다. –