Vue+elementUi开发了一个可拖动和拉伸编辑的画板。

最近几天用vue实现了一个动态编辑模板的小功能，包括自由拖拽div，自由拉伸div，自由设置宽度和颜色文本内容，添加和删除相应的div。

当前组件的Git地址

文章的详细解释是当前组件被封装到npm插件中

下面是具体图片，比较简单。请不要喷。

现在来说说实现的方式。

首先，使用vue的自定义属性将一条指令定义为v-drag。

contain参数用于防止div在拖动过程中超出画布边界。

我们以后会继续完善功能，增加一些新功能。