react-navigation在Redux下多页面跳转

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的执行文件改了下

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容