在 Pageable 抓取事件,判斷目前是在第幾個區塊

分享:

如果要在 Pageable 捲動的時候判斷目前是在哪邊,可以用內建的方法來抓,其內建的方法有:

onst pages = new Pageable("#container");

pages.on("init", data => {
    // do something when the instance is ready
});

pages.on("update", data => {
    // do something when the instance is updated
    
    // this event also fires when the screen size changes
});

pages.on("scroll.before", data => {
    // do something before scrolling starts
    
    // this event will fire when the defined delay begins
    
    // e.g. if the delay is set to 400, this event will
    // fire 400ms BEFORE the "scroll.start" event fires    
});

pages.on("scroll.start", data => {
    // do something when scrolling starts
    
    // this event will fire when the defined delay ends
    
    // e.g. if the delay is set to 400, this event will
    // fire 400ms AFTER the "scroll.before" event fires
});

pages.on("scroll", data => {
    // do something during scroll
});

pages.on("scroll.end", data => {
    // do something when scrolling ends
});

所以說如果我要知道捲動結束後的點,就可以抓 scroll.end 這個事件, console.log(data)後會抓到類似這樣的內容:

{index: 1, percent: 99.81222222222222, scrolled: 421.2075777777778, max: 422}

所以要知道是在第幾個,就抓 data.index 就好了,index 是從 0 開始的。

 

課程推薦

和我們交流

加入我們的社群,裡面會有一些技術的內容、有趣的技術梗,以及職缺的分享,歡迎和我們一起討論。