Android example doesn't work
Opened this issue · 4 comments
Hi,
Your Example
project doesn't work properly, I get the following error:
ReferenceError: Can't find variable: require (line1 in the generated bundle)
Do you know why?
Additionally, I implement the tab on my own project, work very well in iOS, however, in Android I get the following error:
undefined is not an object (evaluating 'el.props.name')
The error occurred on line 29 of your index.js
Thanks for helping
Trying to get this to work too... did you find a solution?
I'm not sure if this will help you, but I fixed my issue by having more than one tab in the Tabs component.
up
import Index from './Home';
import Cart from '../cart/index';
import Account from '../user/my_account';
import Merchant from '../MerchantLogin/home/index';
import CategoriesAll from '../category/Categories';
import Tabs from 'react-native-tabs';
class FooterTabs extends Component {
constructor(props) {
super(props);
this.state = {
page: 'home'
};
}
renderContent(id) {
switch (id) {
case 'home':
return <Index />
case 'category':
return <CategoriesAll />
case 'cart':
return <Cart />
case 'account':
return <Account />
case 'merchant':
return <Merchant />
default:
return <Index />
}
}
renderTabsActive () {
return <Tabs selected={this.state.page} style={{backgroundColor:'white',paddingTop:25}} selectedStyle={{color:'#e73636'}} onSelect={el=>this.setState({page:el.props.name})}>
<Col name="home" selectedIconStyle={{Color:'#e73636'}} style={styles.footerTabCol}>
<Icon style={this.state.page === 'home' ? styles.activeTab:styles.notactiveTab} name="md-home"/>
<Text uppercase={false} style={this.state.page === 'home' ? styles.footerTabTextActive:styles.footerTabTextNotActive}>Home
<Icon style={this.state.page === 'category' ? styles.activeTab:styles.notactiveTab} name="md-albums"/>
<Text uppercase={false} style={this.state.page === 'category' ? styles.footerTabTextActive:styles.footerTabTextNotActive}>Kategori
<Icon style={this.state.page === 'cart' ? styles.activeTab:styles.notactiveTab} name="md-cart"/>
<Text uppercase={false} style={this.state.page === 'cart' ? styles.footerTabTextActive:styles.footerTabTextNotActive}>Cart
<Col name={this.state.access === 'branch'? 'merchant':'account'} selectedStyle={{color:'green'}} style={styles.footerTabCol}>
<Icon style={this.state.page === 'account' ? styles.activeTab:styles.notactiveTab} name="md-person"/>
<Text uppercase={false} style={this.state.page === 'account' ? styles.footerTabTextActive:styles.footerTabTextNotActive}>Akun
}
render() {
return (<Container>
{this.renderContent(this.state.page)}
<Footer style={{
height: 45,
paddingTop: null,
paddingBottom: null,
backgroundColor:'#e73636',
justifyContent:'center'
}}>
<FooterTab style={{
backgroundColor: 'white',
height: 45,
borderTopWidth: 0.5,
borderColor: '#f0f0f0',
justifyContent:'center'
}}>
{this.renderTabsActive()}
</FooterTab>
</Footer>
</Container>);
}
}
export default connect()(FooterTabs);