Vue ctrl+鼠标滚动事件,浏览器禁用与重写

2021-12-27  本文已影响0人  史梦辰
// mounted监听
mounted() {
    window.addEventListener('mousewheel', this.handleScroll, { passive: false })
  }

注意要将passive设置为false,否则会报错,原理:
https://blog.csdn.net/lijingshan34/article/details/88350456

handleScroll(e){
      // 判断是不是按下ctrl键
      if(e.ctrlKey) {
        // 取消浏览器默认的放大缩小网页行为
        e.preventDefault()
        // 判断是向上滚动还是向下滚动
        if (e.deltaY > 0) {
          // 放大重写,业务代码
          this.maxus()
        } else {
          // 缩小重写,业务代码
          this.minus()
        }
      }
    }
上一篇下一篇

猜你喜欢

热点阅读