react-native中ListView组件点击跳转的方法示例
更新时间：2017年09月30日 09:57:35 作者：Tomoya
ListView作为React Native的核心组件,用于高效地显示一个可以垂直滚动的变化的数据列表。下面这篇文章主要给大家介绍了关于react-native中ListView组件点击跳转的相关资料，需要的朋友可以参考借鉴，下面来一起看看吧。
前言
在 上一篇 我们实现了NavigatorIOS与ListView结合使用的方法，那么这篇文章介绍一下ListView里点击跳转到新视图的方法，话不多说了，来一起看看详细的介绍吧。
先看效果
用法
NewsList.js
_onPress(rowData) {
this.props.navigator.push({
title: rowData,
component: CNodeJSList,
passProps: {
name: rowData,
}
})
}
说明
- 使用
this.props.navigator.push()指定component 就可以跳转到下一个视图里了，如果想传值，可以用 passProps 属性，在下一个视图里使用this.props.name接收就可以了 - 对于onPress里方法的调用，如果是以
onPress={this._onPress}调用 _onPress方法，页面是不跳转的，需要绑定this，写法是：onPress={this._onPress.bind(this)}但这样好像没法传值，所以要传值需要这样写：onPress={()=>{this._onPress(rowData)}}，这样就没问题了，页面也可以跳转成功了
总结
以上就是这篇文章的全部内容了，希望本文的内容对大家的学习或者工作具有一定的参考学习价值，如果有疑问大家可以留言交流，谢谢大家对脚本之家的支持。
参考
ListView列表点击跳转
源码：https://github.com/tomoya92/ITNews-React-Native
您可能感兴趣的文章:
相关文章
React找不到模块“./index.module.scss”或其相应的类型声明及解决方法
这篇文章主要介绍了React找不到模块“./index.module.scss”或其相应的类型声明及解决方法,本文给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下2023-09-09
这篇文章主要为大家详细介绍了Mixin、HOC、Render Props、Hooks这四种组件间复用的方式，文中的示例代码讲解详细，感兴趣的小伙伴可以了解一下2023-06-06
useState和useEffect是React的两个重要Hook,用于组件状态管理和处理副作用,useState允许添加状态变量,控制组件渲染,而useEffect用于执行渲染后的副作用操作,本文给大家介绍React中的useState和useEffect详细解析,感兴趣的朋友跟随小编一起看看吧2024-10-10
React.forwardRef的API中ref必须指向dom元素而不是React组件，通过一段示例代码给大家介绍了React forwardRef使用方法及注意点还有一些特殊情况分析，感兴趣的朋友跟随小编一起看看吧2021-06-06
这篇文章主要为大家介绍了React18 中的 Suspense API使用实例详解，有需要的朋友可以借鉴参考下，希望能够有所帮助，祝大家多多进步，早日升职加薪2022-10-10
这篇文章主要介绍了React-hooks中的useEffect,对于React组件来说，主作用是根据数据(state/props)渲染UI，除此之外都是副作用（比如手动修改DOM、发送ajax请求），本文通过实例代码给大家介绍的非常详细，需要的朋友参考下吧2022-05-05
这篇文章主要介绍了React动态更改html标签的实现方式，具有很好的参考价值，希望对大家有所帮助。如有错误或未考虑完全的地方，望不吝赐教2022-12-12
本文主要介绍了浅谈React useDebounce 防抖原理，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧2022-08-08
这篇文章主要介绍了详解在React项目中安装并使用Less（用法总结），文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧2019-03-03
这篇文章主要介绍了React中的权限组件设计,整个过程也是遇到了很多问题，本文主要来做一下此次改造工作的总结，对React权限组件相关知识感兴趣的朋友一起看看吧2022-07-07
最新评论