react-native中路由页面的跳转与传参的实例详解

2023-08-31 10:59:46 作者：摆烂到巅峰

这篇文章主要介绍了react-native中路由页面的跳转与传参,本文通过实例代码给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下

页面跳转

this.props.navigation.navigate('Details')

跳转到"Details"这个页面，但是如果多次跳转到这个页面，页面路由本质上是不会发生改变的。

 this.props.navigation.push('Details')

不建议直接使用push，这样会直接添加路由，而不会看看之前是不是有该路由。

返回上一个页面

this.props.navigation.goBack();
或：
this.props.navigation.pop();

返回堆栈中的第一个页面

 this.props.navigation.popToTop()

this.props.navigation.push('Details', {
     data: 123
 })

<Text>{this.props.navigation.getParam('data')}</Text>
或:
<Text>{this.props.navigation.state.params.data}</Text>

this.props.navigation.setParams({
    data: '321'
})

到此这篇关于react-native中路由页面的跳转与传参的文章就介绍到这了,更多相关react-native路由跳转与传参内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家！