here is the code: (PAY ATTENTION AT COMMENT IN CODE)
import React, { Component } from 'react';
import {Container, Tab, Tabs, TabHeading, Icon, Text } from 'native-base';
import style from './../styles/compoCss' ;
import NewDB from './../database/NewDB';
import Category from "../lists/Category";
import HomePage from './../tabs/HomePage'
export default class TabHome extends Component {
render() {
return (
<Container>
<Tabs initialPage={3} > //THIS CODE DOESN'T WORK :(
<Tab heading={
<TabHeading style={style.footerTabHome}>
<Icon name="md-aperture" style={style.iconFooter} />
<Text style={style.textFooter}>New</Text>
</TabHeading>}>
<NewDB/>
</Tab>
<Tab heading={
<TabHeading style={style.footerTabHome}>
<Icon name="md-bookmark" style={style.iconFooter} />
<Text style={style.textFooter}>Bookmark</Text>
</TabHeading>}>
</Tab>
<Tab heading={
<TabHeading style={style.footerTabHome}>
<Icon active name="md-apps" style={style.iconFooter} />
<Text style={style.textFooter}>Catalog</Text>
</TabHeading>}>
<Category/>
</Tab>
<Tab heading={
<TabHeading style={style.footerTabHome}>
<Icon name="md-home" style={style.iconFooter} />
<Text style={style.textFooter}>Home</Text>
</TabHeading>} >
<HomePage/>
</Tab>
</Tabs>
</Container>
);
}
}
and when I build the app or refresh it , default tab is the 3 (Home) and I think it's correct but don't show the Home page contents and when i scroll I find out that it is stack in tab 0 (new)... I search all of the forums and I can't solve my problem. please help thanks! (this problem is in android device)
this problem tricked by this code (but not I want to solve initialPage)
...
class TabHome extends Component {
componentDidMount(){
setTimeout(this._tabs.goToPage.bind(this._tabs,1))
}
render(){
return ...
<Tabs ref={component => this._tabs = component}>
...
</Tabs>
....
}
}
if it's because of bugs in native base we must wait for update . but except that please help :)