Meteor 中无限滚动实现的订阅行为

Question

我已经使用 Meteor 1.5.0 实现了我自己的无限滚动版本。考虑下面的订阅代码。

Template.App_ViewClients.onCreated(function(){  
    this.autorun(() => {
        Meteor.subscribe('Clients', this.total.get(), this.searchString.get());
    });
});

渲染模板时，默认先抓取20条记录。

每次当我到达屏幕末尾时，this.total 都会递增 20。所以，首先向下滚动给我 40 条记录，然后是 60 条，依此类推。我必须使用 this.autorun 因为 searchString 是来自 UI 的变量输入并且数据必须更改。

下面是我用的滚动码

Template.App_ViewClients.onRendered(function(){
    $(window).scroll(function(event){
        if($(window).scrollTop() + $(window).height() == $(document).height()) {
          console.log('End Reached.');
        }
    });
});

如果我的 Collection 有 1000 条记录，并且我已经滚动了 10 次（即提取了 20*10 = 200 条记录），那么订阅将重置并在我第 11 次滚动到底部时再次提取 220 条记录？所以在第 50 次滚动到底部时，整个订阅被重置并且一次获取 1000 条记录？

If this is the case then how is possible to implement infinite scroll in meteor? Any thoughts?

Answer 1

不，订阅不会"reset"并重新获取相同的数据。如果您将重新订阅相同的订阅但使用不同的 limit 选项，则发布将仅发送您在客户端上没有的那些文档。因此，每次您滚动到屏幕末尾并（作为此操作的结果）重新订阅时 — 发布仅向客户端发送接下来的 20 条记录。

这里有一些有用的链接：

Meteor 中无限滚动实现的订阅行为

Subscription behavior for Infinite Scroll Implementation in Meteor

javascript

jquery

infinite-scroll

meteor

ecmascript-6