javascript - React Native conflict between DrawerLayoutAndroid and Navigator -

i writing app in react native android, , believe there conflict between navigator component , drawerlayoutandroid component.

in index.android.js have following navigator in render method, drawerlayoutandroid component contains navigationpane component list of pages user can navigate to.

class app extends component {   _renderscene(route, navigator){     var component = route.component;     return(       <drawerlayoutandroid         drawerwidth={300}         drawerposition={drawerlayoutandroid.positions.left}         rendernavigationview={() => <navigationpane navigator={navigator} route={route} />}>         <scrollview>           <component {...route.props}             navigator={navigator}             route={route}             onback={() => {              if (route.index > 0) {                navigator.pop();              }            }}          />         </scrollview>       </drawerlayoutandroid>     )   }   render() {     return (         <navigator           initialroute={{ component: localexpensedisplay, name:'home',  index: 0}}           renderscene={this._renderscene}         />     );   } } 

whenever push new scene onto navigator stack, new page renders fine, when try pull drawerlayoutandroid new page, drags new page , pops off stack. drawerlayoutandroid component displayed have been brought initial page.

is there way can have drawerlayoutandroid on every page, without popping new pages off stack when try access it?

edit: here how navigationpane component pushing pages onto stack:

var navigationpane = react.createclass({   gotopage: function(data){     var route = this.props.route;     if(route.name != data.name){       var nextindex = route.index + 1;       this.props.navigator.push({         name: data.name,         index: nextindex,         component: data.component       });     }   },   getinitialstate: function(){     var ds = new listview.datasource({rowhaschanged: (r1, r2) => r1 !== r2});     return {       datasource: ds.clonewithrows(_navigationmenu),     };   },   render: function(){     return (       <scrollview contentcontainerstyle={appstyles.navigationpane}>         <listview           datasource={this.state.datasource}           renderrow={(data) =>{             return (               <view style={appstyles.navitemcontainer}>                 <touchablehighlight                   style={appstyles.navitembutton}                   onpress={this.gotopage.bind(null, data)}>                   <text style={appstyles.navitemtext}>                     {data.name}                   </text>                 </touchablehighlight>               </view>             );           }}         />       </scrollview>     );   } }); 

the _navigationmenu array list of objects name, , react component render.

there isn't documentation reactjs yet, bu fixed problem me. adding configurescene prop navigator gestures empty object prevent navigator applying sort of default gesture navigation.

render() {     return (         <navigator           initialroute={{ component: localexpensedisplay, name:'home',  index: 0}}           renderscene={this._renderscene}           configurescene={() => ({ ...navigator.sceneconfigs.floatfrombottom, gestures: {}})}         />     ); }