as the image can show it ,我的应用程序在页脚顶部和页眉底部显示一行。在Native Base中,这似乎很普通。我已经检查了本机主题,但是找不到一些可以解决此错误的主题。

码:

import React, { Component } from 'react';
import { Container, Content, Footer, FooterTab, Button, Icon, Text, Header, Title, Left, Right, Body, } from 'native-base';
export default class FooterTabsExample extends Component {
  render() {
    return (
          <Container>
              <Header>
                <Left>
                    <Button transparent>
                        <Icon name='arrow-back' />
                    </Button>
                </Left>
                <Body>
                    <Title>Header</Title>
                </Body>
                <Right>
                    <Button transparent>
                        <Icon name='menu' />
                    </Button>
                </Right>
              </Header>
              <Content style={{backgroundColor:'black'}}/>

              <Footer >
                  <FooterTab>
                      <Button>
                          <Icon name="apps" />
                          <Text>Apps</Text>
                      </Button>
                      <Button>
                          <Icon name="camera" />
                          <Text>Camera</Text>
                      </Button>
                      <Button active>
                          <Icon active name="navigate" />
                          <Text>Navigate</Text>
                      </Button>
                      <Button>
                          <Icon name="person" />
                          <Text>Contact</Text>
                      </Button>
                  </FooterTab>
              </Footer>
          </Container>
    );
  }
}

最佳答案

只需将borderBottomWidth替换为Header,将borderTopWidth替换为Footer

<Header style={{borderBottomWidth: 0}}>
  ...
</Header>

...

<Footer style={{borderTopWidth: 0}}>
  ...
</Footer>

09-11 20:10