react-native中路由页面的跳转与传参的实例详解
更新时间:2023年08月31日 11:01:40 作者:摆烂到巅峰
这篇文章主要介绍了react-native中路由页面的跳转与传参,本文通过实例代码给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下
页面跳转
navigate
this.props.navigation.navigate('Details')跳转到"Details"这个页面,但是如果多次跳转到这个页面,页面路由本质上是不会发生改变的。
push
this.props.navigation.push('Details')不建议直接使用push,这样会直接添加路由,而不会看看之前是不是有该路由。
back
返回上一个页面
this.props.navigation.goBack(); 或: this.props.navigation.pop();
Top
返回堆栈中的第一个页面
this.props.navigation.popToTop()
传参
A跳转到B
this.props.navigation.push('Details', {
data: 123
})B获取A传递的参数
<Text>{this.props.navigation.getParam('data')}</Text>
或:
<Text>{this.props.navigation.state.params.data}</Text>改变传到B页面的参数:
this.props.navigation.setParams({
data: '321'
})到此这篇关于react-native中路由页面的跳转与传参的文章就介绍到这了,更多相关react-native路由跳转与传参内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家!
相关文章
React Hooks useReducer 逃避deps组件渲染次数增加陷阱
这篇文章主要介绍了React Hooks 之 useReducer 逃避deps后增加组件渲染次数的陷阱详解,有需要的朋友可以借鉴参考下,希望能够有所帮助,祝大家多多进步,早日升职加薪2022-09-09
React-RouterV6+AntdV4实现Menu菜单路由跳转的方法
这篇文章主要介绍了React-RouterV6+AntdV4实现Menu菜单路由跳转,主要有两种跳转方式一种是编程式跳转另一种是NavLink链接式跳转,每种方式通过实例代码给大家介绍的非常详细,需要的朋友可以参考下2022-08-08
在React中使用Antd上传并读取Excel文件的详细步骤
在React中使用Antd组件库来上传并读取Excel文件,可以结合antd的Upload组件和xlsx库来实现,以下是一个详细的步骤和示例代码,展示如何在React应用中实现这一功能,感兴趣的小伙伴跟着小编一起来看看吧2025-01-01
JavaScript的React框架中的JSX语法学习入门教程
这篇文章主要介绍了JavaScript的React框架中的JSX语法学习入门教程,React是由Facebook开发并开源的高人气js框架,需要的朋友可以参考下2016-03-03
React中的setState使用细节和原理解析(最新推荐)
这篇文章主要介绍了React中的setState使用细节和原理解析(最新推荐),前面我们有使用过setState的基本使用, 接下来我们对setState使用进行详细的介绍,需要的朋友可以参考下2022-12-12


最新评论