React native 使用LinearGradient视图中的React Native places输入包，结果与IOS中的以下内容重叠

我正在实现GooglePlacesAPI。我正在使用react national places input包在搜索城市时获取这些地方

当在任何普通视图元素中使用该包时，它工作正常。 如果我在LinearGradient视图中使用它，则search results视图与IOS中的以下内容重叠。我尝试了很多款式，但是运气不好

import React from 'react';
import { View, Text, Platform} from 'react-native';
import {LinearGradient} from 'expo-linear-gradient';
import PlacesInput from 'react-native-places-input';

const TestScreen = (props) => {
  return (
    <View
      style={[
        {flex: 1},
        Platform.OS === 'ios' ? {paddingTop: 32} : {paddingTop: 22},
      ]}>
      <LinearGradient
        colors={['#64C0CB', '#5EC8C7', '#56D8C3']}
        start={{x: 0, y: 0}}
        end={{x: 1, y: 0}}
        style={{height: 100, paddingLeft: 15, paddingRight: 15}}>
        <PlacesInput
          googleApiKey="AIzaSyAscykL4KzdbH2B6eVccgaYTxjmLl7nPdE"
          onSelect={(place) => {
            console.log(place);
          }}
          placeHolder={'search place'}
          stylesInput={{
            backgroundColor: 'transparent',
            borderWidth: 1,
            borderColor: 'white',
            borderRadius: 22,
            color: 'white',
            fontSize: 18,
          }}
          stylesList={{zIndex: 10002}} /*This is not working */
        />
      </LinearGradient>
      <View style={{flex: 1, justifyContent: 'center', alignItems: 'center'}}>
        <Text>Below content</Text>
      </View>
    </View>
  );
};

TestScreen.navigationOptions = {
  headerShown: false,
};

export default TestScreen;

从“React”导入React；
从“react native”导入{视图、文本、平台}；
从“expo linear gradient”导入{LinearGradient}；
从“反应本地输入”导入位置输入；
常量测试屏幕=（道具）=>{
返回(
{
控制台日志（位置）；
}}
占位符={'search place'}
样式输入={{
背景色：“透明”，
边框宽度：1，
边框颜色：“白色”，
边界半径：22，
颜色：'白色'，
尺码：18，
}}
stylesList={{zIndex:10002}}/*这不起作用*/
/>
低于内容
);
};
TestScreen.navigationOptions={
校长：错，
};
导出默认测试屏幕；

在安卓系统中，它运行良好。如下图所示

在IOS中，它工作不正常。如下图所示