iOS中React Native RefreshControl下拉时显示白线

问题描述

在iOS中，用<ScrollView>拉起refreshControl时会出现一条白线，有人知道原因吗？

<ScrollView
   removeClippedSubviews={true}
   showsverticalScrollIndicator={false}
   refreshControl={
      <RefreshControl
         refreshing={props.listViewState.pullToRefresh}
         onRefresh={handleOnRefresh} 
      />
   }
   contentContainerStyle={{backgroundColor: 'white'}}
>
   <View> ... </View>
   <View> ... </View>
</ScrollView>

white line appears

解决方法

我在使用 Flatlist 时遇到了同样的问题。 试试像 this 这样的东西。

  return (
    <SafeAreaView style={styles.container}>
      <View style={styles.container2}/>
        <FlatList
          data={DATA}
          renderItem={renderItem}
          keyExtractor={item => item.id}
          contentContainerStyle={{ backgroundColor: 'white' }}
          ListHeaderComponent={<View>
          <Text style={{backgroundColor:'#293541'}}>HEADER</Text></View>}
          refreshControl={
            <RefreshControl
              refreshing={refreshing}
              onRefresh={onRefresh}
              tintColor={'red'}
              backgroundColor={'#293541'}
            />
          }        
        />
    </SafeAreaView>
  );

和样式：

container: {
    flex:1,marginTop: StatusBar.currentHeight || 0,backgroundColor: 'white',},container2: {
    position: 'absolute',top: 0,left: 0,width: '100%',height: '60%',backgroundColor: '#293541',