简体   繁体   中英

SortableJS not working with Onsen UI on desktop

Just copy-pasted the example code from Sortable's docs .

It works fine on any touchsreen device, but as soon as I view it on Chrome or any other desktop browser it stops working. No error, you just can't drag anymore.

Onsen UI's JS probably overwrites the drag events or something like that but couldn't manage to find the solution.

Per the answer given here: https://github.com/SortableJS/Vue.Draggable/issues/508#issuecomment-488314106

If anybody faces this issue then the following is a workaround for this;

document.body._gestureDetector.dispose()

If you need to enable it again for any reason, use the following

document.body._gestureDetector = new ons.GestureDetector(document.body);

Since my code is using Sortable in a Vue component, I ended up doing this as part of the options to Sortable.create . It seems to work well enough:

    onChoose: function(event) {
      if(this.$ons) {
        document?.body?._gestureDetector?.dispose();
      }
    },
    onStart: function(event) {
      if(this.$ons) {
        document?.body?._gestureDetector?.dispose();
      }
    },
    onEnd: (event) => {
      if(this.$ons) {
        document.body._gestureDetector = new this.$ons.GestureDetector(document.body);
      }
    },

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM