javascript - react 数据网格中水平滚动的卡住列抖动

Question

我正在使用 react 数据网格。当我在移动设备中加载网格时，卡住列在水平滚动上闪烁。 这是重现错误的链接。

http://adazzle.github.io/react-data-grid/examples.html#/fixed-cols .

只需在移动 View 中加载网格并尝试水平滚动即可。

以前遇到过此问题的任何人，请提出一些解决方案

Answer 1

就我而言，将 -webkit-overflow-scrolling 设置为 auto 没有帮助。也在 this帖子sontek说设置 rowHeight 将修复 ises，但在我的情况下也不起作用。

最后，我必须从自定义 TableRow 组件中删除 border-bottom 才能解决此问题。即使使用 box-sizing 也没有成功。

我做了什么:

<div className={styles.tableRow}>
    {this.props.children}
+    <div className={styles.tableRowBorder} aria-hidden={true} />
 </div>

 .tableRow
 {
     // ...
-    border-bottom: 1px solid $colorGrayLighter3;
+    position:   relative;
 }
+
+.tableRowBorder
+{
+    height:         1px;
+    position:       absolute;
+    pointer-events: none;
+    width:          100%;
+    bottom:         0;
+    left:           0;
+    background:     $colorGrayLighter3;
+}

对于来到这里的任何人来说，问题基本上都是这样的:

用户界面:

DOM: