FlatList组件刷新失败 19-12-30
2019-12-30 本文已影响0人
喜悦莲花
-
问题描述:
仅 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;