本机基础标签 - 知道如何删除标签周围的边框吗？答案

【问题标题】：native base Tabs - any idea how to remove the border around the tabs?本机基础标签 - 知道如何删除标签周围的边框吗？
【发布时间】：2019-10-22 14:49:23
【问题描述】：

以下屏幕截图是下面提供的代码的结果。知道如何删除选项卡周围的边框吗？

import React from 'react';
import { SafeAreaView } from 'react-native';
import { Container, Header, Title, Text, Tabs, Tab } from 'native-base';

export default class Settings extends React.Component {
  static navigationOptions = {
    header: null
  };

  render() {
    return (
      <SafeAreaView style={{ flex: 1 }}>
        <Container
          style={{ flex: 1, backgroundColor: '#fff', marginTop: 30 }}>
          <Header hasTabs transparent>
              <Title style={{ color: 'grey' }}>
                Settings
              </Title>
          </Header>

          <Tabs tabBarUnderlineStyle={{ backgroundColor: 'blue', height: 1 }}>
            <Tab heading="Tab1"
              tabStyle={{ backgroundColor: 'white' }}
              textStyle={{ color: 'grey' }}
              activeTabStyle={{ backgroundColor: 'white' }}
              activeTextStyle={{ color: 'blue' }}>
              <Text>TODO: Tab1</Text>
            </Tab>

            <Tab heading="Tab2"
              tabStyle={{ backgroundColor: 'white' }}
              textStyle={{ color: 'grey' }}
              activeTabStyle={{ backgroundColor: 'white' }}
              activeTextStyle={{ color: 'blue' }}>
              <Text>TODO: Tab2</Text>
            </Tab>
          </Tabs>

        </Container>
      </SafeAreaView>
    );
  }
}

【问题讨论】：

标签： native-base

【解决方案1】：

将tabContainerStyle={{ elevation: 0 }} 添加到<Tabs> 可解决此问题。它似乎是高程（阴影）而不是边框

【讨论】：

【解决方案2】：

这不能使用默认选项卡组件完成，有一个使用可滚动选项卡的workaround，如果你想修改源代码，还有这个workaround

【讨论】：