当前位置: 首页 > news >正文

解决ExtJS 6/7无限滚动表格/列表(infinite: true)无法在触屏Windows浏览器上触摸滚动

ExtJS 6 或 ExtJS 7 在 Windows 触屏电脑的浏览器上,配置了 infinite: true 的表格或列表,无法触摸滚动,而一般的可滚动容器(scrollable: true)可以正常滚动。

这是因为,配置了 infinite: true 的表格或列表,使用的不是普通的可滚动容器(实际是带 overflow-y: auto 样式的 div),而是 Ext.scroll.VirtualScroller,这个容器是监听 touchstart/touchmove/touchend 事件来实现无限滚动的。

所谓无限滚动,就是延迟渲染,是为了解决表格/列表显示大量数据时的性能问题的,具体可以看我以前这篇文章 《关于 Grid 的 Buffered(延迟渲染/无限滚动)相关配置在 ExtJS 各版本中变化》

究其底层原因,是因为 ExtJS 为了适配各种平台(不同系统和不同浏览器),其底层对点击、触摸等事件做了转换。比如非触摸屏的浏览器上,是没有 touchstart/touchmove/touchend事件的,ExtJS 就用 mousedown/mousemove/mouseup 来模拟这些 touch 事件。

但是ExtJS没有处理好触屏windows浏览器上的事件转换。

为了解决这个问题,需要如下增加一个 override

/**
 * workaround for bug in ExtJs 6+.
 * Resolved in current yet unreleased version
 */
Ext.define(null, {
   
    override: 'Ext.dom.Element'
},

相关文章:

  • mysql的源码包安装
  • 【redis】redis内存管理,过期策略与淘汰策略
  • QT串口通信之二,实现单个温湿度传感器数据的采集(采用Qt-modbus实现)
  • 【深度学习】Transformer 的常见的位置编码有哪些
  • 4. MySQL 逻辑架构说明
  • k8s集群部署
  • 深入解析JVM垃圾回收机制
  • podman加速器配置,harbor镜像仓库部署
  • QT(5.15)之QGC(4.4)安装教程
  • springboot3整合knife4j详细版,包会!(不带swagger2玩)
  • 讯飞离线唤醒+离线Vosk识别+DeepSeek大模型+讯飞离线合成持续优化,无限可能~
  • 【Qt】可爱的窗口关闭确认弹窗实现
  • ZT9 游游的字母翻倍
  • 开源AI网络爬虫工具Crawl4AI
  • vue3学习--Vue3与2的区别
  • 分布式服务配置中心
  • STM32-智能台灯项目
  • 游戏开发 游戏开始界面
  • 美颜相机1.0
  • 神经网络八股(1)
  • 通州区网站制作/链友咨询
  • 免费b站不收费网站2023/最近一周新闻
  • 网站空间合同/软件定制开发平台
  • 网站 缓存什么时候使用/南京seo招聘
  • 怎么黑网站/青岛做网站推广
  • 一个网站可以做多少地区词/百度 营销推广怎么操作