zoukankan      html  css  js  c++  java
  • ag-grid 单元格下拉树控件滚动条不可用问题

      ag-grid 有自己的滚动事件,所以引入其中的单元格组件的下拉滚动有的会不好使,具体原因因项目需求原因未能及时探究从根本上解决,故代码层面处理一下。等后续再继续讨论

    // 宿主事件--监听滚轮
    @HostListener('mousewheel', ['$event'])
    _mousewheel($event) {
      if (this.openScroll) {
        // 手动设置界面滚动
        const scrollN = $event.wheelDelta;
        const div = document.getElementsByClassName('combotree-container')[0];
        if (div) {
          if (scrollN > 0 && div.scrollTop > 0) {
            // 向上
            div.scrollTop = div.scrollTop - scrollN > 0 ? div.scrollTop - scrollN : 0;
          } else if (scrollN < 0 && div.scrollTop < div.scrollHeight) {
            // 向下
            div.scrollTop = div.scrollTop - scrollN > div.scrollHeight ? div.scrollHeight : div.scrollTop - scrollN;
          }
        }
      }
    }

       不过这样滚动不够丝滑,调整一下,平滑滚动

    // 宿主事件--监听滚轮
    @HostListener('mousewheel', ['$event'])
    _mousewheel($event) {
      if (this.openScroll) {
        // 手动设置界面滚动
        const scrollN = $event.wheelDelta;
        const div = document.getElementsByClassName('combotree-container')[0];
        if (div) {
          let value = div.scrollTop;
          if (scrollN > 0 && div.scrollTop > 0) {
            // 向上
            value = div.scrollTop - scrollN > 0 ? div.scrollTop - scrollN : 0;
          } else if (scrollN < 0 && div.scrollTop < div.scrollHeight) {
            // 向下
            value = div.scrollTop - scrollN > div.scrollHeight ? div.scrollHeight : div.scrollTop - scrollN;
          }
          div.scrollTo({ top: value, behavior: 'smooth' });
        }
      }
    }
  • 相关阅读:
    RESTful API 设计指南
    Lombok 安装配置及使用方法
    Python——urllib函数网络文件获取
    C与C++面试易出知识点
    编程一年
    Java练习1
    大整数求和
    PHP数组知识点整理
    CSS——NO.10(设置技巧)
    CSS——NO.9(颜色值和长度值)
  • 原文地址:https://www.cnblogs.com/guofan/p/14101779.html
Copyright © 2011-2022 走看看