Backbone JS 滚动事件处理

Question

我正在尝试使用 JQuery 和下划线在主干 JS 中实现滚动事件。在初始化函数中，我添加以下行：

 _.bindAll(this, 'filter_list');
 $(window).scroll(this.filter_list);

其中 filter_list 是我试图为 DB 中的下 50 个条目获取数据的函数。

页面第一次显示来自 DB 的 100 条记录。在页面的滚动点击底部，filter_list 函数被调用，该函数具有从 DB 获取下 50 个条目的逻辑。

当滚动条位于页面底部时会触发滚动事件，但不是一次调用 filter_list，而是多次调用滚动事件，最终从数据库中多次获取相同的数据。添加相同的结果会更新到页面，即多次显示相同的 50 条记录。

我尝试以不同的方式注册事件，但没有用。另外，如果有人可以解释主干JS中的滚动事件和绑定机制，那就太好了，我在互联网上没有得到任何好东西。

提前致谢

Answer 1

每次滚动条移动时都会触发scroll event，您需要自己完成所有获取逻辑。这是一个想法：

var MyView = Backbone.View.extend({
  initialize: function() {
    _.bindAll(this, 'filter_list');
    // also good idea to debounce
    this.filter_list = _.debounce(this.filter_list, 300);
    // Keep internal fetching state
    this.isFetching = false;
    $(window).scroll(this.filter_list);  
  },

  filter_list: function() {
    if (this.scrollHitPageBottom() && !this.isFetching) {
      this.isFetching = true;
      this.fetchDBEntries()
          .finally(function() { this.isFetching = false });
    }
  },

  ... 
})