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

// 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()
        }
      }
    }
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容