No More Posting New Topics!

If you have a question or an issue, please start a thread in our Github Discussions Forum.
This forum is closed for new threads/ topics.

Navigation

    Quasar Framework

    • Login
    • Search
    • Categories
    • Recent
    • Tags
    • Popular
    • Users
    • Groups
    • Search

    iOS issue with -webkit-overflow-scrolling: touch

    Framework
    2
    2
    733
    Loading More Posts
    • Oldest to Newest
    • Newest to Oldest
    • Most Votes
    Reply
    • Reply as topic
    Log in to reply
    This topic has been deleted. Only users with topic management privileges can see it.
    • U
      usu last edited by

      I encountered a strange issue on iOS:

      My app has a QModal which displays several form fields, all wrapped in QField. The modal also has a QBtnToggle which shows/hides certain form fields via v-if.

      On iOS browsers, when toggling QBtnToggle to a different state, the content of QModal would suddenly disappear completely. Modal header is still shown. I can close and reopen the modal, and the content displays again.

      • No error is thrown
      • The error appears consistently an all iOS devices tested so far
      • I was not able to reproduce on a clean JSFiddle so far. That is also the reason I have not yet filed a bug report on Github.

      The error was very difficult to debug. I ended up with removing and adding components to isolate the issue with no success.

      Them I came across this:
      https://forum.vuejs.org/t/peculiar-rendering-bug-on-ios-with-v-bind-v-if-and-nested-single-file-components/22464

      User ‘andosteinemtz’ seemed to encounter exactly the same issue.

      So i added the following to my app style and eureka, the bug is gone (but with that also the nice touch scrolling of iOS):
      .scroll, .scroll-x, .scroll-y {
      -webkit-overflow-scrolling: auto;
      }

      So my question to you:

      • Has anyone encountered anything similar while working with QModal?
      • Does it make sense to have a workaround fix in the Framework? Some possible solutions without disabling the touch scrolling are described here https://stackoverflow.com/questions/7808110/css3-property-webkit-overflow-scrollingtouch-error and here https://patrickmuff.ch/blog/2014/10/01/how-we-fixed-the-webkit-overflow-scrolling-touch-bug-on-ios/. Have not tested them so far though.
      1 Reply Last reply Reply Quote 0
      • erfanSW
        erfanSW last edited by

        horizontal scroll doesn’t work on touch in ios devices,scrollbar doesn’t show.have u any solution?

        1 Reply Last reply Reply Quote 1
        • First post
          Last post