vue拖拽组件自定义指令，解决拖拽和点击事件冲突问题，解决拖拽组件在iframe上面延迟卡顿问题

1.自定义指令

directives: {
     drag(el,data,vnode) {
      const oDiv = el
      oDiv.onmousedown = e => {
      	// 获取ifream，解决拖拽组件在ifream上面卡顿-根据ifream pointerEvents 
      	let iframDiv = document.getElementById("screenProjection")
        if(iframDiv) {
            console.log('按下')
            iframDiv.style.pointerEvents = "none"
        }
        const disY = e.pageY - oDiv.offsetTop
        document.onmousemove = e => {
        //解决onmouseup事件有时候不触发
        if ( el.stopPropagation ) {
            el.stopPropagation()
        }
        if ( el.preventDefault ) {
            el.preventDefault()
        }
          let curT = e.pageY - disY
          const scrModelEle = document.getElementsByClassName('screen-model')[0]
          let minT = 0,maxT = scrModelEle.clientHeight - el.offsetHeight
          //超出盒子问题
          curT = curT<minT?minT:(curT > maxT ? maxT : curT)
          oDiv.style.top = curT + 'px'
        }
        document.onmouseup = e2 => {
          if(iframDiv) {
            iframDiv.style.pointerEvents = "auto"
          }
          document.onmousemove = null
          document.onmouseup = null
          if ( e.clientX == e2.clientX && e.clientY == e2.clientY ) {
          		//点击拖拽冲突
			  vnode.context.showScreenInteraction()
		  }
        }
        return false
      }
    }

2.结构-拖拽元素加上v-drag;不绑定点击事件

<div  v-drag ></div>

3.点击事件写在methods

showScreenInteraction() {
  
},