• 150403

    文章

  • 892

    评论

  • 13

    友链

  • 最近新加了换肤功能,大家多来逛逛吧~~~~
  • 喜欢这个网站的朋友可以加一下QQ群,我们一起交流技术。

vue 绑定元素滚动事件


<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


695856371Web网页设计师②群 | 喜欢本站的朋友可以收藏本站,或者加入我们大家一起来交流技术!

0条评论

Loading...


发表评论

电子邮件地址不会被公开。 必填项已用*标注

自定义皮肤 主体内容背景
打开支付宝扫码付款购买视频教程
遇到问题联系客服QQ:419400980
注册梁钟霖个人博客