小编Muh*_*lik的帖子

HTML 在触摸屏上拖放

我正在执行一项任务,其中涉及拖动图像并检查其放置位置,如果放置在正确的位置则执行操作。虽然它在任何有鼠标的设备上都可以正常工作,但在触摸屏上却不起作用。如何在触摸屏上实现这一目标。使用 Vuejs 2 或 vanilla javascript

拖动项目

<v-row v-for="(item, iterator) in Activity.drag_items" :key="item.class" :class="[item.class, item.status]" class="drag-item">
   <v-img 
      draggable
      @dragstart='startDrag($event, item, iterator)'
      :src="require(`@/assets/img/activities/activity_2/${item.item_img}`)"
      contain
      :class="item.status"
   ></v-img>
</v-row>
Run Code Online (Sandbox Code Playgroud)

掉落物品

<a @drop='onDrop($event, Activity)' @dragover.prevent @dragenter.prevent></a>
Run Code Online (Sandbox Code Playgroud)

拖动功能

startDrag(evt, item, index){
        evt.dataTransfer.dropEffect = 'move';
        evt.dataTransfer.effectAllowed = 'move';
        evt.dataTransfer.setData('item', JSON.stringify(item));
        evt.dataTransfer.setData('index', index);
    }
Run Code Online (Sandbox Code Playgroud)

掉落功能

onDrop(evt, galaxy_location) {}
Run Code Online (Sandbox Code Playgroud)

javascript drag-and-drop touch touchmove vue.js

3
推荐指数
1
解决办法
6006
查看次数

如何计算鼠标指针指向某个点的角度?

如何计算鼠标指针相对于屏幕右下角的角度?

javascript

0
推荐指数
1
解决办法
80
查看次数

标签 统计

javascript ×2

drag-and-drop ×1

touch ×1

touchmove ×1

vue.js ×1