鼠标和空格滚动

Question

有一个应用程序可以监听用户滚动屏幕。 因此，如果使用鼠标滚轮进行滚动，则数据滚动的速度比使用空格滚动页面的速度慢一个数量级。

服务器代码未布置，没有意义。 下面是应用程序代码。

@HostListener('window:scroll', ['$event']) checkScroll() {
    if (!this.getdata) {
        const componentPosition = this.el.nativeElement.offsetTop;
        const componentHeight =  this.el.nativeElement.getBoundingClientRect().height;
        const scrollPosition = window.pageYOffset;
        const windowheight = window.outerHeight;
        const needposition = componentPosition + componentHeight - windowheight - 500;

        if (scrollPosition >= needposition) {
            this.getdata = true;
            this.getMoreNew();
        }
    }

}

getMoreNew() {
    if (!this.nomoredata) {
        const city = this.city;
        const find = this.find;
        const last = this.persones[this.persones.length - 1]['orderbyname'];
        this.httpClient.post<Array<any>>('/assets/api/index.php', {action: 'person', type: this.type, last, limit: this.limit, city, find })
            .subscribe(
                data => {
                    if (data.length === 0) {
                        this.nomoredata = true;
                        this.getdata = false;
                    } else {
                        this.persones = this.persones.concat(data);
                        this.getdata = false;
                    }
                }
            );
    } else {
        this.getdata = false;
    }

}

查看devtools的屏幕截图：

Answer 1

我不完全确定问题是什么，但是我认为这是因为您的滚动太慢，您想找到一种方法来减轻事件的计算负担吗？您可以尝试使用debounce来忽略滚动，直到完成操作为止。