我有一个可变长度列表，其范围可以是5到100个项目，每个项目（文本和图像）的内容都是动态的。
我要做的是将尽可能多的项目尽可能地填满整个可见视口，这样就不会切断任何项目，也没有滚动条。一旦该屏幕已满，我想再拍摄其余部分并再次填满视口，并一遍又一遍地完成，直到我没有项目。除了第一个＆＃34;屏幕＆＃34;应隐藏，然后以指定的间隔在屏幕之间自动旋转。
所以例如图片40项全部相同高度，第1页左侧10条，第1页右侧10条，第2页左侧10条，第2页右侧10条。此方案不是这么糟糕，因为如果我知道屏幕的高度并且在项目上有一个固定的高度我可以做数学来填补它。但是这些项目可以是不同的大小，所以我最终可以在第一页的右边10和第一页的左边8，因为左边的一些项目有更长的内容，因此更高，占用更多的空间。
我一直在努力让我的列表中的每个项目都有一个固定的高度，然后通过js获取视口高度，然后进行数学计算，看看它适合什么。但是，设置固定高度并不理想，因为我的内容是动态的并且可能超过固定高度。我已经玩过使用flexbox来填充一些空隙，然后用js逻辑更难以找出空间并且仍然在相当长的时间内渲染。
有没有人知道是否存在任何有助于此类情景的第三方库，或者对如何更好地实现这一点有任何想法？
任何帮助都将不胜感激。