vue自定义指令--move-with-dragger

需求

    项目某些窗口需要能添加拖拽条，拖着拖拽条随意拖动

测试组件

预期效果

按住handerA和handlerB能进行A/B窗口的拖动，handlerA执行相关事件

结果GIF如下

使用方法

//参数说明

1.onMouseMove:Function       //handler移动事件2.onMouseDown:Function       //handler mousedown事件3.onMouseUp:Function        //handler mouseup事件4.auto:Boolean            //是否自动处理dom style(设置top/left)//1.直接传函数，则默认自动进行移动
v-moveWithDragger:container2
此处directive的arg container2,指代需要进行实际操作的vue ref name;
//2.传入对象
v-moveWithDragger:container="{          onMouseMove,          onMouseDown,          onMouseUp,
          auto        }

完整代码如下