perfect-scrollbar plugin On reaching bottom, fires the event multiple times

Viewed 2728

I am using perfect-scroll plugin

https://github.com/noraesae/perfect-scrollbar

And when I used the ps-y-reach-end event

enter image description here

document.addEventListener('ps-y-reach-end', (event)=> {
   console.log('Why this is printing multiple times when I reach Bottom, I wanted it to be single fire')
 });

Problem is the event fires more than once, when the scroll reached to the bottom of the container.

JSFiddle Demo

Web console prints : enter image description here

Please scroll the y-axis to the bottom and you will see the consoles multiple times

1 Answers

You need to use a boolean flag to handle this

var el = document.querySelector('.container');

Ps.initialize(el);
let loading = false
document.addEventListener('ps-y-reach-end', (event) => {
    if (!loading) {
        loading = true
        alert('Why this is printing multiple times when I reach Bottom, I wanted it to be single fire')
    }

});
Related