Not rendering bottom item in list until scroll
Closed this issue · 4 comments
When loading a list with this library for the first time, the bottom item which should be visible in my list is not.
- I have a div that is 140 px tall.
- Inside I have a div that is 120 px using position: fixed and top: 0px.
- Inside I have another div that is 20 px using position: fixed and bottom: 0px.
This is what I see when I load the library for the first time
This is what happens after I scroll just 1 px....
Unfortunately, this is hard to debug as we are a swift app under the hood with a wkwebview. But this is definitely weird.
Previously we were not virtualizing the list. After adding this in this bug has occurred. Bizarrely, I can't accurately reproduce,it only seems to happen after I reload occasionally... After I scroll 1px just once, it is pretty much permanently fixed until I reload again.
Any thoughts?
If it gives you more context on what we are building and why it might be weird, the URL is here: withfig.com
After reviewing the code, it seems like my problem is I am changing both the div height + the number of items in my list. However, until I scroll, no event is being triggered to change the number of items being displayed. As I start off at height 0 and items.length = 0, the max number of items it would show me was 5 (the buffer you created).
I just submitted PR #8 . It gives the user more control over the buffer and initial items to display. Plus it doesn't break anything for existing users. You will just need to add this to the docs :)
Let me know if I you need changes.
Thank's for the submission and for the PR.
I think I understand the issue.
I already thought of adding the "bench" as prop (some items to render before the first and after the last visible)
I'll review/try it out one of this days
Should be ok now with version 0.1.0