vue3 监听元素滚动到底部加载

const handleScroll = (e) => {
    if(e.target.scrollTop + e.target.clientHeight == e.target.scrollHeight) {
        if(list.value.length % 10 > 0) return
        data.pager.pageNumber ++;
        getData();
    }
}
watch(() => show.value, () => {
    nextTick(() => {
        if(show.value) {
            document.querySelector(".list-box")?.addEventListener('scroll', handleScroll)
        }else{
            document.querySelector(".list-box")?.addEventListener('scroll', handleScroll)
        }
    })
})

const getData = () => {
    GetAllTaskList(data).then(res => {
        if(res.success) {
            list.value = list.value?.concat(...res.result.list)
            if(res.result.list.length == 0) {
                document.querySelector(".list-box")?.removeEventListener('scroll', handleScroll)
            }
        }
    })
}
getData();
posted @ 2022-04-25 11:14  郭大蛋子  阅读(1685)  评论(0编辑  收藏  举报