vue2移动端滑动移动指

vue2移动端滑动移动指令+按钮滑动时候页面被跟着滚动的尴尬问题

当触摸开始的时候 给body加上overflow = 'hidden'属性阻止按摩会随着页面滚动

export default {
  name: '',
  data () {
    return {}
  },
  created () {
  },
  mounted () {
  },
  methods: {},
  directives: {
        // DIV点击移动
        drag: {
            inserted: function (el) {
                el.ontouchstart = function (e) {
                    var disx = e.touches[0].pageX - el.offsetLeft;
                    var disy = e.touches[0].pageY - el.offsetTop;
                    // 当触摸开始的时候 给body加上overflow = 'hidden'属性阻止按摩会随着页面滚动
                    document.body.style.overflow = 'hidden'
                    document.ontouchmove = function (e) {
                        el.style.left = e.touches[0].pageX - disx + 'px';
                        el.style.top = e.touches[0].pageY - disy + 'px';
                    }
                    document.ontouchend = function () {
                       //  触摸结束 再设置为自动
                        document.body.style.overflow = 'auto'
                        document.ontouchmove = document.ontouchend = null;
                    }
                }
            },

        }
    }
}