Reactjs + Meteor与pub / sub for infinte scrolling

时间:2016-06-10 10:33:56

标签: meteor reactjs

我正在使用React在Meteor中编写应用程序。我正在尝试实现无限滚动功能。

我正在做的是订阅一个限制的出版物,该出版物由我的组件状态跟踪。当组件检测到它已到达底部时,它会增加其状态的限制。

这会触发重新渲染和订阅更多数据。

我遇到的问题是整个组件被重新渲染。它失去了滚动位置并带你到顶部。

如何根据状态保存的限制实现pub / sub的无限滚动,并且只在组件中添加添加额外的行而不是渲染整个行?

订阅无限制的整个列表不是我的选择

2 个答案:

答案 0 :(得分:1)

所以,我找不到使用pub / sub的方法,所以我不得不使用Meteor.call,基于skip()和limit() > page 从数据库中获取数据,然后将该数据保存在组件的状态中。

这样它不会重新渲染整个事物,只会为它接收的新数据添加节点。

这也意味着没有发生自动套接字的事情,这对我的用例来说很好。

我得到的一个好处是很容易知道数据库中是否还有更多数据需要获取。除非你添加一个包,否则使用pub / sub会非常棘手。

答案 1 :(得分:0)

您必须将数据存储在某个堆栈中并将其放大。 React将只渲染堆栈的新元素,而不是重新渲染整个组件。