Vue-grid-layout: No scroll on mobile android possible, if draggable is false

[msiggi]

Hi,

as mentioned in the topic: if draggable== false, I´m not able to scroll down the website on my samsung-android-smartphone touching a GridItem. You can check it also on your demo-site https://jbaysolutions.github.io/vue-grid-layout/examples/06-responsive.html - if you open in on a smartphone. Scolling is only possible if I hit the space between to items.

Many thanks for your support.

[aiankile]

The following combination did the trick for me (both scrolling & edit/dragging mobile, which might even be an overkill if you don't need mobile edit):

:is-draggable="edit"
:touch-action="edit ? 'none' : 'auto'"
:class="{edit}"
plus css (for some reason, iirc different browser):
.vue-grid-layout.edit { touch-action: none; }

@touchmove="e => { if(edit) e.preventDefault() }"

^ edit is local display/edit mode flag
^ also, iirc, Safari still has some issues with dragging.

[msiggi]

@aiankile : Thanks for your answer, but it´s not working for me. I created a codepen based on the sample from vue-grid-Demo: https://codepen.io/msiggi/pen/JwQXzm including you ideas. There is still no scrolling possible on my android-phone (chrome).

please can you check it?

[aiankile]

@msiggi, well, now that you mention it, it doesn't work in our project too anymore^^ wow / still investigating / trying out a slightly older version (prior to touch fix commits)

[Cgarcilazo]

Hi, does anyone solve this problem?

[bagaskarala]

Hi, does anyone solve this problem?

add style

<style> .vue-grid-item.no-touch { touch-action: auto; } </style>