前言

• 试着用react-dnd进行拖拽轮播图，拖拽快照上会有偏差。经过一系列探究，找到了几种解决方法。

探究原因

• react-dnd里为了方便各个后台的使用，把transform保存成数据，结果只要拖拽的元素存在transform，或者不停的transform，就会产生快照不对位的问题。

解决方法

• 第一种方法，就是直接换图片。react-dnd提供preview，直接换图片即可解决快照问题。
• 第二种方法，使用preview的位移偏差，由于transform被使用，但是还留有top和left未被使用，preview中也有对偏差的配置，所以区别下item，设置偏差即可。但是这个如果是轮播图那种位移偏差不固定的就不行。
• 第三种方法，拖拽前去除transform，使其静止，这样就不会有问题。
• 第四种方法，纯手写，如果拖拽不是跨度很大的组件，且目标元素未使用react-dnd，可以纯手撕解决。

其他

• 在react-dnd的issue里存在大量这种偏移问题无法解决，这也是跨组件通信遗留的问题，不知道下次升级能不能解决它。