1 . 安装
npm install --save react-native-scrollable-tab-view
2 . 如果react-native版本是 0.61.0以上,组件viewpager被剔除了,这时会报错:
"RNCViewPager" was not found in the UIManager?
3 . 不要慌,把viewpager下回来就可以了
yarn add @react-native-community/viewpager
4 . 这时引入并且实例化了,还不显示,那是因为 <ScrollableTabView>
外边必须是弹性盒子,加上flex:1,就可以显示了
import ScrollableTabView,
{
DefaultTabBar,
ScrollableTabBar
} from 'react-native-scrollable-tab-view';
<View style={{ flex:1}}>
<ScrollableTabView>
<Text tabLabel='Tab 1'>Tab 1</Text>
<Text tabLabel='Tab 2'>Tab 2</Text>
<Text tabLabel='Tab 3'>Tab 3</Text>
</ScrollableTabView>
</View>
5. 的所有父级必须全部是 flex:1,不然会出现各种问题,例如无法切换。