首发于：卡拉云技术博客
代码库位于: react-draggable中文教程代码
要运行本教程中的代码，先 git pull 后执行
npm install
npm run start
在实现卡拉云时，我们也大量使用了 react-draggable。所以这篇文章里，我们介绍如何使用 react-draggable，一些常见的设置和我们的经验。请根据下面的代码一步步实现，最终你要实现的效果如下
react-draggable 经过几年的发展，已经是一个相对比较稳定的库了。从 npm trends 上看，从 16 年起它的流行程度就迅速超过了其它几个类似的项目。它在 github 上算非常热门的项目了，使用它的项目众多，所以可以放心地使用。如果有 bug 反馈也会非常快
如果看它的源码的话，会发现它的原理其实很简单，它只是将一个需要被拖拽的组件包到它定义的一个组件中，当鼠标拖拽时，重新计算组件的位置，这样就实现了“拖拽”的效果。这也是绝大多数拖拽组件库的实现方式。