我正在使用反应数据网格。当我在移动设备中加载网格时,冻结的列在水平滚动时闪烁。这是重现错误的链接。
http://adazzle.github.io/react-data-grid/examples.html#/fixed-cols。
只需在移动视图中加载网格并尝试水平滚动。
以前遇到过此问题的任何人,请提出一些解决方案
我正在使用反应数据网格。当我在移动设备中加载网格时,冻结的列在水平滚动时闪烁。这是重现错误的链接。
http://adazzle.github.io/react-data-grid/examples.html#/fixed-cols。
只需在移动视图中加载网格并尝试水平滚动。
以前遇到过此问题的任何人,请提出一些解决方案
在我的情况下设置-webkit-overflow-scrolling
没有auto
帮助。同样在这篇文章中, sontek说设置rowHeight
将修复在我的情况下也不起作用的问题。
最后我不得不border-bottom
从我的自定义TableRow
组件中删除来解决这个问题。即使玩弄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;
+}
对于任何来到这里的人来说,这基本上就是问题的样子:
用户界面:
我正在观察同样的行为。将以下内容添加到数据网格容器有助于:
-webkit-overflow-scrolling: auto;