Ver código fonte

bug fix: 从背景开始拖动,光标移动到其他元素上,mouseup,会开启拖动功能。

任一存 3 anos atrás
pai
commit
0891a714ed
2 arquivos alterados com 6 adições e 7 exclusões
  1. 1 1
      src/components/HotSpot.vue
  2. 5 6
      src/views/HomeView.vue

+ 1 - 1
src/components/HotSpot.vue

@@ -4,7 +4,7 @@
       class="hot-spot__img"
       src="@/assets/hotspot.png"
       alt=""
-      draggable="false"
+      @dragstart.prevent
     >
   </div>
 </template>

+ 5 - 6
src/views/HomeView.vue

@@ -1,18 +1,18 @@
 <template>
   <div
     class="home"
-    draggable="false"
     @mousedown="onMouseDown"
     @mousemove="onMouseMove"
     @mouseup="onMouseUp"
     @mouseleave="onMouseLeave"
     @wheel.passive="onWheel"
+    @dragstart.prevent
   >
     <img
       class="landscape"
       src="@/assets/landscape.png"
       alt=""
-      draggable="false"
+      @dragstart.prevent
     >
     <div
       class="people-far"
@@ -23,7 +23,7 @@
       <img
         src="@/assets/people-far.png"
         alt=""
-        draggable="false"
+        @dragstart.prevent
       >
     </div>
     <div
@@ -37,7 +37,7 @@
         :class="peopleNearColorStatus"
         src="@/assets/people-near-serial-frame.png"
         alt=""
-        draggable="false"
+        @dragstart.prevent
       >
       <HotSpot
         class="hot-spot"
@@ -51,7 +51,7 @@
       }"
       src="@/assets/introduce.png"
       alt=""
-      draggable="false"
+      @dragstart.prevent
     >
   </div>
 </template>
@@ -82,7 +82,6 @@ export default {
   watch: {
     translateLength: {
       handler(v) {
-        console.log(v)
         if (v > 0) {
           v = 0
           this.translateLength = v