vue自定义指令--resizable

需求

鼠标悬浮到dom边框【可设置上下左右】时，出现伸缩图标，按住后拖动可以执行特定事件

测试组件

预期效果

如需求

结果GIF如下

使用方法

//参数说明

1.传入回调函数，拦截mousemove
v-resizable.prevent.stop="handleResize1"

handleResize1({ offsetX, offsetY, deltaX, deltaY, dir }){}2.传入对象
 v-resizable.prevent.stop="{        dir: 'right  bottom',       //需要处理的方向，多个时空格隔开，有top left bottom right        onMouseMove: handleResize3  //拦截mousemove }"

directive代码