React-Navigation 指定跳转到某个页面

最新推荐文章于 2024-07-23 10:43:02 发布

七月_代码君

最新推荐文章于 2024-07-23 10:43:02 发布

阅读量5.3k

点赞数 1

分类专栏： react-native 文章标签： react-native 跳转指定页面

本文链接：https://blog.csdn.net/weixin_40166364/article/details/80050644

版权

本文探讨了在React-Navigation中如何实现两种不同的页面跳转方式：一种是通过层层路由进行导航，另一种是从现有页面直接跳转到未在路由历史中的目标页面。详细解析了在React-Native应用中精准控制页面流转的方法。

摘要由CSDN通过智能技术生成

两种跳转的情况

通过路由一层层跳转

从A-B-C-D， 最好从D-A  (从第二个页面开始传递参数)
从A开始跳转到B,在B页面跳转至C页面的时候需要传递参数key
this.props.navigation.navigate('C', {key: this.props.navogation.state.key})

从C跳转到D页面 

const {params} = this.props.navogation.getNavState()

this.props.navigation.navigate('D', {key: params.key})

从D返回到A页面

const {params} = this.props.navogation.getNavState()

const backAction = NavigationActions.back({
            key: params.key,
});

this.props.navigation.dispatch(backAction)

在某个页面跳转到没有经历过路由的页面

import SkinTestRecord from './module/ageloc-me/SkinTestRecord';
import Agelocme from './module/ageloc-me/Agelocme';


const TabStack = TabNavigator(
    {
        Tab1: {
            title: '首页',
            login: true,