react-navigation目前是RN必备的导航,正常的单级跳转 返回 传值 只要按官方的方法即可,或者参考兔神的文章。但是项目中往往需要用到多级跳转,这个时候就需要花点功夫了。
在正常情况下要多级跳需要改源代码,相当不方便,这里是基于redux环境的跳转。
首先,在要跳转的页面导入:
import { NavigationActions } from 'react-navigation'
然后,在跳转的方法里面:
等需要操作的方法执行完之后:
const resetAction = NavigationActions.reset({
index: 0,
actions: [
NavigationActions.navigate({ routeName: 'Main'})
]
})
this.props.navigation.dispatch(resetAction)
我这边demo是执行退出方法,将路由重置,这样用户登录后下次进来就是首页了。
index是指tabbar的第一个选项,routeName就是定义的页面名字,可以根据自身的需求进行页面跳转。
所以,大概方法就是如此拉。
--------------- 补充 ---------------
在导航v2.0以上的版本,方法有所变化
import { StackActions,NavigationActions } from 'react-navigation';
const resetAction = StackActions.reset()
reset的执行文件改了下