Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Mobile scrolling with page-mode doesn't render past "keeps" items #345

Open
allynsweet opened this issue Jun 7, 2021 · 0 comments
Open
Labels

Comments

@allynsweet
Copy link

allynsweet commented Jun 7, 2021

Describe

When using a mouse wheel to scroll on MacOS, the virtual scroll works as intended in page-mode. However, when testing on a physical iOS device and Chrome mobile simulators, the virtual list only renders the amount of items set by :keeps. For example, if :keeps is set to 20, the page will render 20 items despite the list being greater than 20, and then there will be a ton of whitespace beneath the rendered components.

To Reproduce

Steps to reproduce the behavior:

  1. Use page-mode, populate list items greater than the :keeps prop.
  2. My component looks like this:
<virtual-list
            ref="itemList"
            class="scroll-touch"
            data-key="id" :keeps="20"
            :page-mode="true"
            :estimate-size="355"
            :data-sources="items"
            :data-component="component"
          />

.scroll-touch was taken from the page mode example.
3. Run on a mobile phone or mobile simulator, and scroll past the number of items defined by :keeps.

Other

  • Version 2.3.2
  • iOS Chrome and Safari
  • MacOS Safari
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Projects
None yet
Development

No branches or pull requests

1 participant