vue 绑定元素滚动事件

最新推荐文章于 2023-10-03 15:48:42 发布

weixin_34153893

最新推荐文章于 2023-10-03 15:48:42 发布

阅读量5.4k

点赞数

文章标签： javascript python ViewUI

原文链接：https://my.oschina.net/jack088/blog/1921678

版权

2019独角兽企业重金招聘Python工程师标准>>>

<div class="listCard-component" ref="viewBox"></div>

mounted() {
//         首先通过$refs获取dom元素
            this.box = this.$refs.viewBox;
//             监听这个dom的scroll事件
            this.box.addEventListener('scroll', this.loadingMore, false);
        },

async loadingMore(){
//        console.log(this.$refs.viewBox.scrollTop);
//        console.log(this.$refs.viewBox.scrollHeight);
//        console.log(this.$refs.viewBox.offsetHeight);
//         console.log(document.documentElement.clientHeight+'-----------'+window.innerHeight); // 可视区域高度
//         console.log(document.body.scrollTop); // 滚动高度
//         console.log(document.body.offsetHeight); // 文档高度
        let isLoadingMore = false;
        if(this.$refs.viewBox.scrollTop + this.$refs.viewBox.offsetHeight >= this.$refs.viewBox.scrollHeight - 50) {
            if(!isLoadingMore && this.canLoadingMore){
                isLoadingMore = true;

                // TODO
            }
        }

转载于:https://my.oschina.net/jack088/blog/1921678