如何去除原生标签的边框

Question

我需要删除我在图片中标记的边框。

我正在使用 react-native 和 native-base 选项卡。我需要删除选项卡的底部边框。

<Tabs>
      <Tab heading="Tab1">
        <Tab1 />
      </Tab>
      <Tab heading="Tab2">
        <Tab2 />
      </Tab>
      <Tab heading="Tab3">
        <Tab3 />
      </Tab>
    </Tabs>

Answer 1

我找到了解决方案，

需要实现ScrollableTab，然后

<ScrollableTab style={{ borderWidth: 0}}>

Answer 2

试试这个方法<Tabs tabContainerStyle={{ borderBottomWidth: 0 }}>

Answer 3

尝试：

<ScrollableTab style={{borderBottomWidth: 0, backgroundColor: 'some_color'}} 
/>

或

<TabHeading style={{
                backgroundColor: 'some_color',
                borderBottomWidth: 0,
}}>

或将以下 prop/attribute 添加到组件中：

tabBarUnderlineStyle={{backgroundColor: '#eff2f8'}}

Answer 4

对于仍在尝试删除边框的每个人。这是由于高程引起的问题。将此添加到选项卡标签：

<Tabs tabContainerStyle={{elevation: 0}}>
...
</Tabs>

如何去除原生标签的边框

How to remove the border of native-base tabs

android

reactjs

react-native

native-base