美文网首页React NativeReact Native
React Native的Navigator禁止全部界面的左滑手

React Native的Navigator禁止全部界面的左滑手

作者: jay_den | 来源:发表于2017-03-28 13:01 被阅读1030次

如果想禁用全部界面可以有下面二种方法:
方法一:
在使用Navigator时,配置configureScene的gestures为null

 configureScene= {(route) => {
             return ({
                  ...Navigator.SceneConfigs.PushFromRight,
                 gestures: null
          });
       }
 }

方法二:
自己定义个configureScene:

const NoBackSwipe = {  
  ...Navigator.SceneConfigs.HorizontalSwipeJump,  
    gestures: {  
      pop: {}  
    }  
}; 

然后在Navigator标签下使用

<Navigator   
      initialRoute={{Component:'xxx', name:'xxx', index:0, configure: NoBackSwipe}}  
      renderScene={this.renderScene.bind(this)}  
      configureScene={(route,routeStack)=>{  
        return NoBackSwipe  
      }}  
    />  

这里主要是处理了pop,其中还有jumpback,jumpforward的

如果你只是想禁用某些界面那可以看下面代码:
首先在Navigator配置的时候不要写死是哪个手势,要传进来:

configureScene={(route) => ({
         ...route.sceneConfig || Navigator.SceneConfigs.PushFromRight,
           gestures: route.gestures
  })}

然后再你要跳转的时候,如果是要开启手势的:

            const{navigator} = this.props;
            if(navigator){
                navigator.push({
                    component: LoginView,
                    sceneConfig: Navigator.SceneConfigs.PushFromRight,
                    gestures: Navigator.SceneConfigs.PushFromRight.gestures
                });
            }

如果是要禁止手势的:

        const{navigator} = this.props;
        if(navigator){
            navigator.push({
                component: Home,
                sceneConfig: Navigator.SceneConfigs.PushFromRight,
                gestures: null
            });
        }

相关文章

网友评论

  • 天才木木:很有效,facebook都没把这些写进文档里,谢谢了

本文标题:React Native的Navigator禁止全部界面的左滑手

本文链接:https://www.haomeiwen.com/subject/fadjottx.html