Ios Iphone 5状态栏已被覆盖

Ios Iphone 5状态栏已被覆盖,ios,iphone,react-native,statusbar,Ios,Iphone,React Native,Statusbar,我的代码在大多数Iphone上运行良好,但在Iphone 5上,状态栏已被视图覆盖,我不知道如何在Iphone 5中设置视图的边距,除非我在视图中使用边距顶部,否则在其他Iphone中看起来很奇怪 componentWillMount() { this.startHeaderHeight = 45 this.marginTopHeader = 0 this.iconMargin = 9 if (Platform.OS == 'and

我的代码在大多数Iphone上运行良好,但在Iphone 5上,状态栏已被视图覆盖,我不知道如何在Iphone 5中设置视图的边距,除非我在视图中使用边距顶部,否则在其他Iphone中看起来很奇怪

componentWillMount() {
        this.startHeaderHeight = 45
        this.marginTopHeader = 0
        this.iconMargin = 9
        if (Platform.OS == 'android') {
            this.startHeaderHeight = 30 + StatusBar.currentHeight
            this.marginTopHeader = 23 + this.marginTopHeader
            this.iconMargin = this.iconMargin
        }

    }
    render() {
        var width = Dimensions.get('window').width - 128;
        var height = Dimensions.get('window').height;
        return (
            <SafeAreaView  style={{
                height: this.startHeaderHeight, flexDirection: 'row',
                borderBottomColor: '#ddd', backgroundColor: '#3A3658', marginTop: this.marginTopHeader
            }} >

                <Icon
                    lightTheme
                    style={{ marginLeft: 8, marginRight: 5, marginTop: this.iconMargin, color: 'white' }} size={25} name="ios-menu" onPress={() => {
                        this.props.draw();
                    }}    />
            <View style={{position: 'absolute', right: 7}}>

                <Icon style={{ color: '#fff',marginTop: this.iconMargin ,padding:0,}} size={25} name="ios-cart" onPress={() => {
                        this.props.cart();
                    }}>
                   <Text style={{color:'red', fontWeight:'bold', fontSize:10}}>{this.props.cartItemCount}</Text>

                    </Icon>

</View>
            </SafeAreaView >
componentWillMount(){
此.startHeaderHeight=45
this.marginTopHeader=0
this.iconMargin=9
如果(Platform.OS=='android'){
this.startHeaderHeight=30+状态栏.currentHeight
this.marginTopHeader=23+this.marginTopHeader
this.iconMargin=this.iconMargin
}
}
render(){
var width=Dimensions.get('window')。宽度-128;
var height=维度。获取('WINDOWS')。高度;
返回(
{
this.props.draw();
}}    />
{
this.props.cart();
}}>
{this.props.cartItemCount}

你可以试着这样写

<View style={{flex: 1, backgroundColor: 'white'}} >
        {/* header */}
        <View style={{paddingTop: system.ios.x ? 22 : 0}}>
          <View style={{
            height: Platform.select({ios: 64, android: 44}),
            backgroundColor: 'white',
            justifyContent: 'flex-end'
          }}>
          `enter code here`
          </View>
        </View>
</View>

{/*头*/}
`在这里输入代码`