页面跳转时,报  Undefined is not an Object(evaluating this2.props.navigation.navigate)

出错原因:在一个页面组件中调用了另一个组件,而跳转动作在被调用组件中定义。则会出现:当前呈现页面的this与跳转动作发生的this不一致,导致跳转动作不能被调用。

解决办法:在当前呈现页面获取跳转动作调用方法,作为参数传递给跳转动作发生组件。

例如:

export default class PayFailedPage extends Component {
render() {
return (
<View style={{flex:1}}>
<View style={{flex:1}}>
<PageTop navigate={this.props.navigation.navigate}/></View>
</View>
);
}
}

在跳转动作发生组件中定义跳转:

class PageTop extends Component{
render(){
return (
<View>
<View>
<Button onPress={()=>{
this.props.navigate('Index');
}} style={{flex:1}} title="回到首页"/>
</View>
</View>
);
}
}

ReactNative踩坑日志——页面跳转之——Undefined is not an Object(evaluating this2.props.navigation.navigate)的更多相关文章

  1. ReactNative踩坑日志——使用async/await语法解决网络请求的异步导致的指令执行顺序错乱问题

    转载请注明原文地址: ReactNative的fetch是天然的异步请求,因此,如果你在一个代码块中使用了fetch,那么在执行的时候程序不会等待网络响应结束才执行下一条代码,而是会直接按顺序执行完整 ...

  2. ReactNative踩坑日志——代码执行方式(面向对象)

    在ReactNative中,是以面向对象的方式执行代码的.处于同一{}內的代码以对象的形式执行,也就是说,程序虽然会自上而下执行代码,但是它会保证当前整个代码块內的语句执行完毕才执行下一代码块. 举个 ...

  3. ReactNative踩坑日志——OnPress随着render()执行被自动调用?

    在ReactNative中,Text.Button以及其他Touchable包装成的可点击控件,都可以通过onPress属性为其指定点击时的响应函数. 在有些情况下,我们会把这些点击函数先定义好,然后 ...

  4. ReactNative踩坑日志——如何实现删除scrollview中的视图

    在reactNative中,页面是根据state值的变化来重新渲染的.因此,传统的前端开发中通过 id 来移除一个页面元素的做法在这里不适用. 一般,我们是通过遍历数组或map来渲染出scrollvi ...

  5. ReactNative踩坑日志——fetch如何向服务器传递参数

    一:简单参数 简单的参数,我们可以使用手动拼接的方式传递. 格式为: fetch(url?key1=val1&key2=val2&...).then((response) => ...

  6. ReactNative踩坑日志——函数绑定this

    ES6语法定义的函数没有自动绑定this,所以在函数中使用了 this.xxx 就会报错,因为没有把类实例等this传进函数中. 有两种方法绑定this: 法1:在构造函数中为其他函数绑定this c ...

  7. React-Native 踩坑过程

    踩坑过程: 解决方法就是去 SDK Manager 把 23.0.1 的版本下载了 而如果报错信息中含有bintray.com.gradle.org等网址,请***,反复重试,或者去react nat ...

  8. react-native 踩坑记

    最近在使用react-native的时候遇到了很多坑,这里给大家分享下 一.样式 react-native 虽然支持flex布局,但是所有的样式均是css样式的一个很小的集合,尤其是在安卓机下问题尤为 ...

  9. ReactNative 踩坑小计

    使用ES6語法編寫Component時綁定事件需要用this.MethodName.bind(this),否則MethodName中無法使用this <TouchableHighlight on ...

随机推荐

  1. Linux终端执行shell脚本,提示权限不够的解决办法

    原文:http://blog.csdn.net/this_capslock/article/details/17415409 今天在Linux尝试搭建dynamips的工作环境,在执行shell脚本时 ...

  2. Android之取消ViewPage+Fragment的预加载

    用过ViewPage+Fragment组合的童鞋自然知道这个问题,没有遇到的同学祝愿你们永远不会遇到,呵呵.直接上关键代码 注释:setUserVisibleHint每次fragment显示与隐藏都会 ...

  3. linux批量改名

    rename 's/abc/xyz/' * 把包含abc的文件名,替换为xyz

  4. [Android P] Android P版本 新功能介绍和兼容性处理(一)

    cp from :https://blog.csdn.net/yi_master/article/details/80046696 Android P版本已经到来,首篇我们当然要先看下Android ...

  5. SVG.js 基础图形绘制整理(二)

    一.折线 var draw = SVG('svg1').size(300, 300); //画折线 //使用字符串点 // var polyline=draw.polyline('0,0 100,50 ...

  6. python读取yaml配置文件

    支持多种语言:python.js.golang.java.c.c++ YAML 语言(发音 /ˈjæməl/ )的设计目标,就是方便人类读写.它实质上是一种通用的数据串行化格式. 它的基本语法规则如下 ...

  7. window.open 浏览器差异.

    首先引入 w3help的,莫的测试: 原帖地址:http://www.w3help.org/zh-cn/causes/BX1053   w3help的测试,和我的测试相互补充,应该比较完整了.悲剧的是 ...

  8. spark 指定相关的参数配置 num-executor executor-memory executor-cores

    num-executors参数说明:该参数用于设置Spark作业总共要用多少个Executor进程来执行.Driver在向YARN集群管理器申请资源时,YARN集群管理器会尽可能按照你的设置来在集群的 ...

  9. 操作系统重点双语阅读 - 上下文切换 Context Switch

    The context is represented in the PCB of the process. It includes the value of the CPU registers, th ...

  10. Kafka:ZK+Kafka+Spark Streaming集群环境搭建(二十二)Spark Streaming接收流数据及使用窗口函数

    官网文档:<http://spark.apache.org/docs/latest/streaming-programming-guide.html#a-quick-example> Sp ...