利用vue進行頁面滾動監聽,上拉刷新

一、利用vue進行頁面滾動監聽,上拉刷新javascript

methods: {
                handleScroll(){
                    let page = document.getElementById('content');
                    // console.log(this.tempScrollTop,page.scrollTop,page.clientHeight,page.scrollTop+page.clientHeight,page.scrollHeight);
                    if(page.scrollTop+page.clientHeight >= page.scrollHeight-25){
                        if(page.scrollTop+page.clientHeight >= page.scrollHeight-5){
                            this.more = '加載中...';
                            this.pageNo ++;
                            fnInitData();
                        } else if(this.tempScrollTop > page.scrollTop){
                            this.more = '';
                        } else {
                            this.more = '上拉加載更多...';
                        }
                        this.tempScrollTop = page.scrollTop;
                    } else {
                        this.more = '';
                        console.log(this.pageNo,this.more);
                    }
                },
            },
            mounted(){
                document.getElementById('content').addEventListener('scroll',this.handleScroll);
            },
            beforeDestroy(){
                document.getElementById('content').removeEventListener('scroll', this.handleScroll);
            }
相關文章
相關標籤/搜索