Home » vue » window.addEventListener for scroll event not responding [closed]

window.addEventListener for scroll event not responding [closed]

Posted by: admin November 26, 2021 Leave a comment

Questions:

I am adding 2 event listeners. One for resizing and one for scrolling. The one for resizing works but for scrolling doesn’t and I can’t seem to find out why this is.

mounted() {
    window.addEventListener('resize', this.onWindowResize);
    window.addEventListener('scroll', this.onWindowScroll);
}

onWindowResize() {
    this.internalVisible = false;
    this.$emit('resize');
}

onWindowScroll() {
    console.log('HIT');
}

beforeDestroy() {
    window.removeEventListener('resize', this.onWindowResize);
    window.removeEventListener('scroll', this.onWindowScroll);
}

Can someone guide me what is/may be happening?

Answers:

Go to any website with scoll and paste the below in console of browser

window.addEventListener(‘scroll’, e=> console.log(e));

it will log you the event, so to be sure it is working fine.

Please check if your website have scroll functionality – to be specific if the page is scrollable or not.. or else it will not invoke

###

I am not familiar with vue.js;
but if only look at pure javascript: and you would add this in console of chrome inspector and your window can scroll it will invoke;

so your eventlisteners seem not to be the problem;

 window.addEventListener('resize', this.onWindowResize);
 window.addEventListener('scroll', this.onWindowScroll);


function onWindowResize() {
   console.log('res');
}

function onWindowScroll(e) {
  console.log('scroll');
}