react-native-tabs icon indicating copy to clipboard operation
react-native-tabs copied to clipboard

Android example doesn't work

Open KBLNY opened this issue 10 years ago • 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

KBLNY avatar Apr 29 '16 08:04 KBLNY

Trying to get this to work too... did you find a solution?

latimesmike avatar Oct 25 '16 20:10 latimesmike

I'm not sure if this will help you, but I fixed my issue by having more than one tab in the Tabs component.

latimesmike avatar Oct 25 '16 20:10 latimesmike

up

creativefull avatar Oct 31 '16 06:10 creativefull

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</Text> </Col> <Col name="category" style={styles.footerTabCol}> <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</Text> </Col> <Col name="cart" style={styles.footerTabCol}> <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</Text> </Col> <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</Text> </Col> </Tabs> }

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);

nagacoder avatar Apr 20 '18 08:04 nagacoder