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

On mobile, scrolling locked even within modal #82

Open
dancherb opened this issue Nov 9, 2020 · 3 comments
Open

On mobile, scrolling locked even within modal #82

dancherb opened this issue Nov 9, 2020 · 3 comments

Comments

@dancherb
Copy link

dancherb commented Nov 9, 2020

When putting the element on my page in any form, the following errors call:

this.scrollableArea.addEventListener is not a function
this.scrollableArea.removeEventListener is not a function

I'm using it as the docs suggest, in a modal component:

<div>
          <TouchScrollable>
                <View>
                            {p.children}
                 </View>
           /TouchScrollable>
</div>

What I'm trying to achieve: currently the scroll lock works great on standard web by just including when necessary on my root screen. As suggested by the docs, it's not playing well on mobile - even the modals become locked from touch scrolling.

Update: seems like the error only occurs when you use a custom child component (i.e. View) - div doesn't cause the error. However, touch scrolling is still locked in the modal when it shouldn't be (standard mouse scrolling in Chrome simulator, and on desktop browsers, still works fine).

@dancherb dancherb changed the title this.scrollableArea.addEventListener is not a function when using TouchScrollable On mobile, scrolling locked even within modal Nov 9, 2020
@dancherb
Copy link
Author

dancherb commented Nov 9, 2020

It seems like this isn't related to <ScrollLock/> - just putting any elements inside <TouchScrollable> prevents their scrolling on mobile, without a <ScrollLock/> anywhere in the document or project.

@Lukavyi
Copy link

Lukavyi commented Nov 9, 2020

I have the same issue

@rick-liruixin
Copy link

They stopped the repairs. I had to do it myself, in the same way, with a new version of typeScript. And fix these problems for everyone to use. add react hooks、vue3 example

npm i body-scroll-lock-upgrade

repair log,Refer to the releases page.
@Lukavyi @dancherb

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

3 participants