Browse Source

fix: 修复drag拖动边界和自定义位置冲突的问题

jerry 5 years ago
parent
commit
4ad472a587
2 changed files with 5 additions and 5 deletions
  1. 1 1
      src/packages/drag/demo.vue
  2. 4 4
      src/packages/drag/drag.vue

+ 1 - 1
src/packages/drag/demo.vue

@@ -18,7 +18,7 @@
     </nut-drag>
     <h4 :style="{ top: '350px' }">限制拖动边界</h4>
     <div class="drag-boundary"></div>
-    <nut-drag :boundary="{ top: 401, left: 9, bottom: bottom(), right: right() }" :attract="true" :style="{ top: '400px', left: '8px' }">
+    <nut-drag :boundary="{ top: 401, left: 9, bottom: bottom(), right: right() }" :attract="true" :style="{ top: '450px', left: '50px' }">
       <div class="touch-dom">拖动我</div>
     </nut-drag>
   </div>

+ 4 - 4
src/packages/drag/drag.vue

@@ -70,14 +70,14 @@ export default {
       this.screenWidth = domElem.clientWidth;
       this.screenHeight = domElem.clientHeight;
       el.style.zIndex = this.zIndex;
-      if (this.boundary.left) {
+      if (this.boundary.left && el.style.left === 0) {
         el.style.left = this.boundary.left + 'px';
-      } else if (this.boundary.right) {
+      } else if (this.boundary.right && el.style.right === 0) {
         el.style.right = this.boundary.right + 'px';
       }
-      if (this.boundary.top) {
+      if (this.boundary.top && el.style.top === 0) {
         el.style.top = this.boundary.top + 'px';
-      } else if (this.boundary.bottom) {
+      } else if (this.boundary.bottom && el.style.bottom === 0) {
         el.style.bottom = this.boundary.bottom + 'px';
       }
     },