React Native: render only once tab view - reactjs

Question

i have been using this plugin react-native-tab-view and for my case i have 5 routes but all use the same component so its rendered five times the component and also have an api call that i have inside the component that its fired 5 times.So my question is if there is a way to render only the tab that i selected besides iam using the same component this is my code:
const FirstRoute = () => (
<View>
<PostsList />
</View>
);
const initialLayout = {
height: 0,
width: Dimensions.get('window').width,
};
class Home extends Component {
constructor() {
super();
this.state = {
isData: true,
index: 0,
routes: [
{ key: 'first', title: 'Todos' },
{ key: 'second', title: 'Encontrados' },
{ key: 'third', title: 'Perdidos' },
{ key: 'four', title: 'Adopción' },
{ key: 'five', title: 'Seguidos' },
]
};
}
_renderTabBar = props => (
<TabBar
{...props}
scrollEnabled
indicatorStyle={styles.indicator}
style={styles.tabbar}
tabStyle={styles.tab}
labelStyle={styles.label}
/>
);
_renderScene = SceneMap({
first: FirstRoute,
second: FirstRoute,
third: FirstRoute,
four: FirstRoute,
five: FirstRoute
})
_handleIndexChange = index => {
this.props.selected_tab(index);
this.setState({
index,
});
}
render() {
return (
<TabView
navigationState={this.state}
renderTabBar={this._renderTabBar}
renderScene={this._renderScene}
onIndexChange={this._handleIndexChange}
initialLayout={initialLayout}
/>
)
}
}