更新于 

不错的npm包

VDR(vue3-drag-resize-rotate)

技术简介

demo地址

VDR是一个基于vue框架,能够快速实现dom元素的拖动、缩放、旋转、图层控制等操作的插件,

更高级的功能还有网格对齐、位置冲突检测、元素吸附、辅助线等等,

提供了大量的事件和自定义接口,非常灵活,

官网文档写的很完备,非常好的插件

实际使用:canvas-base-vdr
未填坑:画布的缩放

最初使用滚轮控制画布zoom值,
能够实现画布收缩的效果,并且不改变dom的原始尺寸。

问题在于zoom与 vdr 的拖拽和缩放计算有冲突。

导致如下问题:
放大后,物体移动距离比鼠标实际的移动距离要大,
缩小后,物体移动距离比鼠标的实际移动距离要小

vdr原作者是提供dom缩放功能的,但是使用的是scale变换,会改变元素的原始尺寸,
因此这部分后面还有待实现。

vue-print-nb 页面/分页/指定元素打印

能够快速实现页面/dom元素打印的Vue扩展,
非常方便。

代码库地址

1
npm install vue-print-nb --save