javascript - 请求为滚动触发两次
问题描述
我正在使用 VueJs 开发一个网站,并且我使用 JQuery 来实现滚动功能。
当用户滚动到页面底部时,我正在增加页面编号。起初(page = 1)它只显示一个请求。但是当向下滚动时,会同时触发两个请求(page = 2,page = 3)。
getDisplay()
用于获取数据的函数,我为此设置LIMIT
了OFFSET
值。
mounted: function() {
this.getDisplay();
this.bindScroll();
},
methods: {
bindScroll: function(){
var vm = this;
$(window).bind('scroll', function () {
if ($(window).scrollTop() === $(document).height() - $(window).height()) {
if(vm.isMorePost > 0){
vm.showLoading = 1;
vm.page++;
vm.getDisplay();
}
}
})
},
getDisplay: function() {
var input = {
name: this.userId,
recordPerPage: this.recordPerPage,
page: this.page
};
this.loadingIcon = 1;
this.$http.get('/display-view/show/get-user-display', {params: input}).then(function(response) {
this.display = this.display.concat(response.data.data);
this.isMorePost = (response.data.data.length);
if(response.data.data.length == 0){
this.showLoading = 0
}else {
this.showLoading = 1
}
}.bind(this));
}
},
当用户遇到页面底部时,我只需要触发一个增加页面编号的请求。我该如何解决这个问题?
解决方案
推荐阅读
- javascript - 如果我的 for in 循环中的属性低于 1000,我需要发出警告
- angular - 如何更改角度材料输入中线条的颜色?
- java - 多个 && (and) 和 || (或)在 for 循环中。检查哪一项?
- ruby-on-rails - 调用 gem 方法时 nil:NilClass 的未定义方法“键”
- html - 如何单击 Bootstrap 4 输入组内的 HTML 输入来触发绑定的 Angular 事件
- c++ - 在 C++ 中的行上压缩的稀疏矩阵
- powershell-4.0 - MailKit/MimeKit 在 PowerShell 4 上出现错误,但在 PowerShell 5.1 上有效
- ruby-on-rails - 如何在 Rails 的选择表单中访问外部属性?
- c - 如果没有括号如何处理 if 和 else?
- java - 无法从 START_OBJECT 令牌中反序列化 `java.lang.String` 的实例(杰克逊)