antvis / wx-f2

F2 的微信小程序
MIT License
1.28k stars 185 forks source link

iOS上拉回弹期间触摸图表,会造成页面卡死 #208

Open ddosakura opened 4 years ago

ddosakura commented 4 years ago

v1.1.4

仅iOS

iOS上拉后,在页面回弹效果未结束期间触摸图表,会造成页面卡死,需要滚动非图表区域才能使页面恢复正常。

你们官方的 demo 就可以复现这个问题。

你们官方的 demo

herofei commented 4 years ago

我也遇到同样的问题,是否有解决方案?

ddosakura commented 4 years ago

我也遇到同样的问题,是否有解决方案?

我有个不算完美的方案

{
        "onReachBottomDistance": 0
}
    // fix ios 上拉回弹时触摸图表导致卡死的 bug
    onReachBottom() {
        wx.pageScrollTo({
            selector: "#bug-fix" // 页面底部放个空白元素就行
        })
    }

只能处理用户从上面滚动下来的情况,要是本来就在底部,还往下滑去触发这个bug,因为触底事件不会触发,所以没辙。

qiaobox commented 4 years ago

@ddosakura 我用你这个方法处理但问题还是存在

MrChen2016-08-27 commented 3 years ago

我也遇到同样的问题,是否有解决方案?

我有个不算完美的方案

{
        "onReachBottomDistance": 0
}
    // fix ios 上拉回弹时触摸图表导致卡死的 bug
    onReachBottom() {
        wx.pageScrollTo({
            selector: "#bug-fix" // 页面底部放个空白元素就行
        })
    }

只能处理用户从上面滚动下来的情况,要是本来就在底部,还往下滑去触发这个bug,因为触底事件不会触发,所以没辙。

但是下拉回弹的时候触摸图表同样还是卡死了,并且文档找不到设置距离顶部多少距离触发的参数可以填写

MrChen2016-08-27 commented 3 years ago

我用了一个看起来比较笨的方法,如果只需要展示的话,在图表组件同级下面增加一个CoverView <CoverView className="cover-view"></CoverView>

CoverView的样式为

.cover-view{ position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 99999; }

也就是用一个透明的覆盖物把图表组件全部覆盖住,这样上拉和下滑就不会触摸到图表了,并且依然不影响展示