How to remove the border of native-base tabs

问题

I need to remove the border as I marked in the image.

I am using react-native & native-base tabs. I need to remove the bottom border of tabs.

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

回答1:

I found the solution,

Need to implement ScrollableTab, Then

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

回答2:

Try this way <Tabs tabContainerStyle={{ borderBottomWidth: 0 }}>

回答3:

For everyone still trying to remove the border. This is the problem due to elevation Add this to Tabs Tag:

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

回答4:

Try:

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

or

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

or add below prop/attribute to component:

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

来源：https://stackoverflow.com/questions/51466904/how-to-remove-the-border-of-native-base-tabs