zoom缩放vuedraggable失效

在vue2项目中需要做一个排序功能，便想到了拖拽排序，于是安装了vuedraggable第三方库。在之前由于要适应笔记本高分辨率小屏幕，便使用了zoom对body元素进行缩放

对分辨率大于1的直接进行body缩放0.8

if(window.devicePixelRatio > 1) {
    document.getElementsByTagName("body")[0].style.zoom = 0.8;
}

        由于这个缩放导致了vuedraggable的失效，百思不得其解的是缩放功能是在拖拽功能开发之前完成的，此拖拽功能开发完成后也在笔记本测试过是可以正常使用的，但是近期突然笔记本发现不能拖放；

最终找到的影响原因确实是由zoom缩放导致的，参考百度的结果vue.draggable失效的问题；

找到vuedraggable的官方示例页面进行测试将body或者拖拽的父级元素进行zoom缩放后确实导致拖拽不起效果；

最终我的想到的解决办法是既然是zoom的影响那么把此影响消除即可，所谓负负得正。

对需要拖拽的父级元素进行zoom缩放，body缩小0.8，那么它的父级元素放大1.25不就可以吗？

经测试及官方示例页面测试可以解决问题！完美解决

<Draggable ref="dragRef" v-model="sortArr"  draggable=".drag-item">
    <transition-group :style="zoomStyle">
        <template v-for="(item) in sortArr">
            <el-tag class="drag-item" :key="item.id"> {{ item.book_name }}</el-tag>
        </template>
    </transition-group>
</Draggable>

computed:{
    zoomStyle() {
      return window.devicePixelRatio > 1?{ zoom: 1.25 }:{ zoom: 1 }
    }
  },

 算是一个骚操作吧，若各位有其它想法欢迎讨论学习。