FlatList组件刷新失败 19-12-30

  • 问题描述:
    仅 iOS 平台,有较大几率下拉刷新时不会触发绑定的 onRefresh 方法

  • 问题分析:
    查看 Flatlist 组件文档,发现 RefreshControl 组件中有一句

    当ScrollView处于竖直方向的起点位置(scrollY: 0),此时下拉会触发一个onRefresh事件。

    于是, 去除导航栏发现 refresh 事件正常.
    查看导航栏组件发现 SafeAreaView 组件, 该组件用于适配刘海屏.
    于是,去除SafeAreaView组件发现问题消失

  • 处理代码:

    • 区分 iOS 平台, 区分 iPhoneX 以上机型

    import { Platform, Dimensions } from "react-native";
    const X_WIDTH = 375;
    const X_HEIGHT = 812;
    const { height: D_HEIGHT, width: D_WIDTH } = Dimensions.get("window");
    const isIphone = Platform.OS === 'ios';
    const isIphoneX = Platform.OS === 'ios' &&((D_HEIGHT === X_HEIGHT && D_WIDTH === X_WIDTH) || (D_HEIGHT === X_WIDTH && D_WIDTH === X_HEIGHT))

    • 根据布局调整样式

    const navHeight = isIphoneX ? 30 : 20;

©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容