I followed the quick start for the dnd kit React library, and it lets me drag and drop just fine with a mouse. However, when I try to use the same page with Chrome on Android, I can't drag the item. It looks like it starts moving and then gets stuck as soon as my finger moves outside its original border.
I tried switching to the drag overlay, but that didn't seem to make any difference.
How can I support touch users with dnd kit?
It wasn't covered in the quick start, but I found the answer in the Draggable section's recommendations:
In general, we recommend you set the
touch-actionproperty tononefor draggable elements in order to prevent scrolling on mobile devices.
I found that I could either set the CSS style on the draggable element itself, or on a parent element that contains several draggable elements.
However, when I started trying to drag items around within a list or grid of items, that stopped working. Eventually, I had to switch from using the pointer sensor to using the mouse and touch sensors, as described in the sensors section.
