now there is such a requirement as follows: blue box pop-up window binds the onmousedown (pc) / ontouchstart event through the vue custom instruction to achieve free drag and drop.

question:

there is another slider module in the descendant node that can be dragged, but the influence of the onmousedown-onmousemove method of the parent node in front of the goose results in the slider in the red box below cannot be dragged

<div class="dialog-box" v-selfDrag=""v-slider__thumb-label primary"">
</div>

drag.js

bind (el, binding, vnode) {
    el.onmousedown = (ev) => {
      if (!ev.target.className || ev.target.className === binding.value) return
      let disX = ev.clientX - el.offsetLeft
      let disY = ev.clientY - el.offsetTop
      document.onmousemove = (ev) => {
        let l = ev.clientX - disX
        let t = ev.clientY - disY
        el.style.left = l + "px"
        el.style.top = t + "px"
      }
      document.onmouseup = () => {
        document.onmousemove = null
        document.onmouseup = null
      }
    }
}

grudging solution (previous code):
(1) identify nodes that do not need to be dragged in advance className;
(2) Mouse binds the node of onmousedown, and binds its target.className whether it is className

this is a very stupid method. Is there a more efficient way?