js onmousemove使用注意：进入onmousemove不代表移动鼠标

场景：开发一个鼠标可拖动的组件，组件可通过点击进行展开收起。

问题：使用了onmousedown,onmouseup,onmousemove，click失效了/(ㄒoㄒ)/~~。现在要判断用户到底是拖动组件还是点击展开组件。

原始代码大致是：

...
isShow = false;//组件是否展开
hasMove = false;//是否移动
elm.onmousedown = function(e) {
    e.preventDefault();
    document.onmousemove = function(e) {
        hasMove = true;
        ...
    }
    document.onmouseup = function(e) {
        if(!hasMove&&!isShow){
            isShow = true
        }
    }

}

后来发现点击事件也能展开，就是前几次点击总是不打开，点两次后才能顺滑的操作。一直以为是用户点击后移动了才导致点不开，所以没当回事。后来自己仔细点了才发现，这不是操作问题，是BUG。问题就是进入onmousemove事件后不代表就移动了鼠标，有可能是没有移动的。

解决：代码就不贴出来了，大致思路就是在onmousemove事件中计算鼠标偏移量，根据偏移大小判断是在拖动组件还是点击展开。改后效果杠杠的，操作瞬间顺滑了。