我的 NativeBase 结果的 header 组件是空的，不在顶部

Question

当我使用 nativeBase 中的 header 组件时： enter image description here

import React, { Component } from 'react';
import changeNavigationBarColor,{ showNavigationBar } from 'react-native-navigation-bar-color';
import { Container, Header, Left, Body, Right, Button, Icon, Title } from 'native-base';

import { main, discoverPage } from './../../assets/style'
import HeaderOfPage from './../../components/Header'


export default class Splash extends Component {
    componentDidMount() {
        setTimeout(() => {
            showNavigationBar()
        },200)
        changeNavigationBarColor('#1f2128', true)
    }
    
    render() {
        return (
            <Container style={[main.Container,{backgroundColor:'#1f2128'}]}>
                <Header>
                  <Left>
                    <Button transparent>
                      <Icon name='arrow-back' />
                    </Button>
                  </Left>
                  <Body>
                    <Title>Header</Title>
                  </Body>
                  <Right>
                    <Button transparent>
                      <Icon name='menu' />
                    </Button>
                  </Right>
                </Header>
            </Container>
        )
    }
}

不知道为什么，可能是因为我用changeNavigationBarColor 有人可以帮助我吗？

Answer 1

你在 main.Container 中给了 Flex 了吗？这似乎是 Container 组件中样式的问题。

Answer 2

在 Native Base +3 版本中，Header 组件已弃用。如果你搜索官方文档。您可以找到此信息：

With v3 we have removed the Header as it can be easily built using HStack. You can checkout its recipe here.

我的 NativeBase 结果的 header 组件是空的，不在顶部

my header component of NativeBase result is empty and not on top

javascript

react-native

native-base