React-Native在登陆成功或注销后销毁路由,只保留当前栈

前言

在移动APP中,我们经常会遇到登陆成功,或者注销后,不允许返回上一页面,这就需要我们清楚栈中的其余view, RN中我们应该如何处理呢?

方法

主要原理是借助于onDidFocus和immediatelyResetRouteStack两个方法实现。

对此我们先看看Navigator提供给我们默认的方法有哪些?

  • getCurrentRoutes() - 获取当前栈里的路由,也就是push进来,没有pop掉的那些。
  • jumpBack() - 跳回之前的路由,当然前提是保留现在的,还可以再跳回来,会给你保留原样。
  • jumpForward() - 上一个方法不是调到之前的路由了么,用这个跳回来就好了。
  • jumpTo(route) - 跳转到已有的场景并且不卸载。
  • push(route) - 跳转到新的场景,并且将场景入栈,你可以稍后跳转过去
  • pop() - 跳转回去并且卸载掉当前场景
  • replace(route) - 用一个新的路由替换掉当前场景
  • replaceAtIndex(route, index) - 替换掉指定序列的路由场景
  • replacePrevious(route) - 替换掉之前的场景
  • resetTo(route) - 跳转到新的场景,并且重置整个路由栈
  • immediatelyResetRouteStack(routeStack) - 用新的路由数组来重置路由栈
  • popToRoute(route) - pop到路由指定的场景,在整个路由栈中,处于指定场景之后的场景将会被卸载。
  • popToTop() - pop到栈中的第一个场景,卸载掉所有的其他场景。

在具体使用中,我们需要添加一个onDidFocus属相,然后判断当前路由是否要求重置整个线路。

<Navigator
    ref="navigator" initialRoute={{name: LaunchView}} renderScene={this.renderScene} configureScene={this.configureScene} onDidFocus={(route) => { if (route.reset) { this.refs.navigator.immediatelyResetRouteStack([{ name: route.name }]) } }} />

使用方法:

this.props.navigator.push({name: yourview Name,reset:true});

ok,搞定了!

React-Native在登陆成功或注销后销毁路由,只保留当前栈

标签:number   script   cep   哪些   nat   markdown   ade   如何   esc   

原文地址:http://blog.csdn.net/jiangbo_phd/article/details/60871434

猜你喜欢

转载自www.cnblogs.com/linliangzhen789/p/12101211.html