i'm building app tabview looks :
the code following :
tabview.js
resettotab(index, opts) { var selected = this.state.selected; this.setstate({selected: index}); this.refs.tabs.jumpto(this.refs.tabs.state.routestack[index]); this.props.ontab(index); }; renderscene = (tab, navigator) => { return ( <navigator style={{backgroundcolor: '#ffffff'}} initialroute={tab.component.route()} ref="views" renderscene={(route, nav) => { return react.createelement(route.component, _.extend({navigator: nav}, route.passprops)); }} configurescene={() => { return { ...navigator.sceneconfigs.fadeandroid, defaulttransitionvelocity: 1000, gestures: {} }; }} /> ); }; render() { return ( <view style={styles.tabbarcontainer}> <navigator style={{backgroundcolor: '#ffffff'}} initialroutestack={this.props.tabs} initialroute={this.props.tabs[this.props.initialselected || 0]} ref="tabs" key="navigator" renderscene={this.renderscene} configurescene={() => { return { ...navigator.sceneconfigs.fadeandroid, defaulttransitionvelocity: 10000, gestures: {} }; }} /> {this.state.showtabbar ? [ <view key="tabbar" style={styles.tabbartabs}> {_.map(this.props.tabs, (tab, index) => { return this.rendertab(index, tab.name, tab.icon, tab.pastille, tab.hasshared); })} </view> ] : []} </view> ); };
main.js
render() { return ( <view style={{flex: 1}}> <tabview ref="tabs" ontab={(tab) => { this.setstate({tab}); }} tabs={[ { component: liste, name: 'découvrir', icon: require('../assets/img/tabs/icons/home.png') }, { component: friends, name: 'amis', icon: require('../assets/img/tabs/icons/friend.png'), pastille: this.state.friendspastille < 10 ? this.state.friendspastille : '9+' }, { component: recostep1, icon: require('../assets/img/tabs/icons/add.png'), hasshared: mestore.getstate().me.has_shared }, { component: notifs, name: 'notifs', icon: require('../assets/img/tabs/icons/notif.png'), pastille: this.state.notifspastille < 10 ? this.state.notifspastille : '9+' }, { component: profil, name: 'profil', icon: require('../assets/img/tabs/icons/account.png') } ]} initialskipcache={!!this.notiflaunchtab} initialselected={this.notiflaunchtab || 0} tabsblocked={false} /> </view> ); };
only, when tapping on bottom menu items, jump correct route navigator in render scene not reset first view. i've tried access this.refs.views
it's undefined. when resettotab called, i'd able this.refs.views.resetto(this.props.tabs[selected].component.route())
this.refs.views
undefined. i'm pretty stuck on one.
Comments
Post a Comment