Welcome toVigges Developer Community-Open, Learning,Share
Welcome To Ask or Share your Answers For Others

Categories

0 votes
770 views
in Technique[技术] by (71.8m points)

Vue3 setup语法 怎么去写scroll的防抖功能

function debounce(fn, wait) {
    var timeout = null;
    return function() {
        if(timeout !== null) 
                clearTimeout(timeout);
        timeout = setTimeout(fn, wait);
    }
}
// 处理函数
function handle() {
    console.log(Math.random()); 
}
// 滚动事件
window.addEventListener('scroll', debounce(handle, 1000));

这个代码用 setup 写时,这个绑定怎么写
下面代码有问题

<div @scroll="debounce(mousewheel,1000)"></div>

setup(){
        function debounce(fn,wait) {
            let timeoutID = null
            return function () {
                if (timeoutID != null) clearTimeout(timeoutID) 
                timeoutID = setTimeout(fn,wait)
            }
        }

        function mousewheel(e){
            console.log(e);
        }
        
                return {
            mousewheel,debounce
        }

}

与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
Welcome To Ask or Share your Answers For Others

1 Answer

0 votes
by (71.8m points)
<div @scroll="mousewheel"></div>

function debounce(fn,wait) {
            let timeoutID = null
            return function () {
                if (timeoutID != null) clearTimeout(timeoutID) 
                timeoutID = setTimeout(fn,wait)
            }
        }

setup(){

        const mousewheel = debounce((e){
            console.log(e);
        }, 1000)
        
                return {
            mousewheel
        }

}

与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
Welcome to Vigges Developer Community for programmer and developer-Open, Learning and Share
...