vue组件拖动布局学习中,目前遇到难题,求解

目前已实现功能是,拖动左边的组件到右边预览区,成功显示,并且可拖动交换顺序
遇到问题:未能实现,将组件移动至布局组件里面去,自己想了很久都未能解决,求支援
代码地址:https://gitee.com/StevenMinrun/dragDemo.git

img

试试mouseMove事件,在你对这个按钮mouseDown的时候,获取当前坐标,在mouseMove时候把坐标偏移量赋给按钮的定位偏移量,这样就实现了拖动按钮跟着鼠标移动的效果。然后在mouseUp的时候计算当前按钮组件的坐标与布局组件的坐标差,把坐标差作为偏移量给按钮组件绝对定位赋值,布局组件相对定位,就实现了松开鼠标把按钮组件放到布局组件中想要的位置。最后在mouseMove事件中的函数做节流处理,因为mouseMove的触发频率特别高