虚拟列表问题

问题一

1 .鼠标滚动一次,逻辑是真实滚动的scrollTop还是显示数据加1,毕竟我们需要的是换一批数据,而不是滚动一些数据,甚至出现那种特殊情况,显示一半隐藏一半的情况

1 .现在是滚动一次就会触发好几次scroll事件,所以这样绑定的话,必然是一次性加好几个。
2 .而且还要自己知道
3 .可以自己做一个进度条的,但是自己做的话,精度又不能保证。这个是最骚的。所以还是要使用这个,只不过要优化下。现在列表变化的时候。界面不流畅
4 .闪动的原因是每一个列的间隔不同。

2 .还有一种就是当高度特别长的时候,会出现滚好久都不会变化的情况。

问题二 每一项高度不确定的时候

1 .他的原理是这样的,在高度已知的时候根据所有的数据算出总的高度,然后通过scrolltop来的出此时应该显示的数据。但是第一步就不通,高度是要在渲染出来才能求出来的,那这样虚拟列表的还有存在的必要么
2 .https://zhuanlan.zhihu.com/p/34585166
这篇文章的作者给出的示例https://jsfiddle.net/furybean/mnkfq0xm/
他还是使用给出数据来计算自己的高度,这样就是数组在构建的时候就要给出一个自己高度的预估值,根据里面的字数,但是这个如果页面宽度变化的话是不适用的。那他是怎么搞出来的高度呢?

3 .
image.png

4 .这个还有一个问题就是如果数据动态增加的话,整个逻辑需要重新计算一遍。

自己方法来实现虚拟列表,不过他的进阶方法还是可以学习一下

1 .问题1,滚动一次鼠标为什么会触发好几次scroll事件
2 .但是这样有一个结果一开始不算高度的话,是没法触发滚动事件的。日了,所以还是要走上面那一条路
3 .

基本概念

1 .可视区域

1 .滚动元素的视觉可见区域,用来计算固定高度(或者最小高度)下,一个可是区域可以展示的元素的个数。在使用组件的时候,可以给出一个最小预估高度,先把滚动条展示出来

2 .可滚动区域

1 .

问题三

1 .平时鼠标滚轮滚动一次,会触发8次scroll事件,一共会滑动100px.的距离,也就是如果我们的最小的每一个条目是小于100的,那么很可能我们滑动一次鼠标们就会跳过两个条目,这个我们不想看到的,所以节流函数的触发就是要让我们再一次滑动的时候,最多滑动最小条目的高度,如果我们的最小条目高度是50的话,那么我们就让一次滑动触发4次scroll事件
2 .所以就要加一个节流事件。来对scroll事件的触发进行操作
3 .这个好像没用,你只能触发让他1秒滚动一次,但是无法避免他滚动一次滚动100px的距离吧。
4 .那看来每次最小粒度是1个条目的问题,光靠滚动距离这个是实现不了了,还是需要那种滚一下,位置前移一个简单吧.

竟然没写关键代码

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。