使用react-navigation时,单页面设置navigationOptions中,进行Static中调用方法,不能像以下设置

onPress = {()=>this.clickFinishButton()}
export default class extends Component {
static navigationOptions = ({
navigation,
screenProps
}) => ({
headerTitle: 'List实现多选',
headerTitleStyle: {
color: 'white'
},
headerStyle: {
backgroundColor: Color.kMainColor // 设置导航栏的背景颜色,headerTintColor设置无效
},
headerRight:(
<NavigationItem
title='完成'
// 这里注意: static里面不能使用this调用方法,出现clickFinishButton is not function
// 参考博客: http://www.jianshu.com/p/2f575cc35780
// onPress={()=>navigation.state.params.navigatePress()}
onPress = {()=>this.clickFinishButton()}
/>
)
});

解决方法:

export default class extends Component {
static navigationOptions = ({
navigation,
screenProps
}) => ({
headerTitle: 'List实现多选',
headerTitleStyle: {
color: 'white'
},
headerStyle: {
backgroundColor: Color.kMainColor // 设置导航栏的背景颜色,headerTintColor设置无效
},
headerRight:(
<NavigationItem
title='完成'
// 这里注意: static里面不能使用this调用方法,出现clickFinishButton is not function
// 参考博客: http://www.jianshu.com/p/2f575cc35780
onPress={()=>navigation.state.params.navigatePress()}
// onPress = {()=>this.clickFinishButton()}
/>
)
});
componentDidMount(){
// 处理数据源
this.handlerDataSource();
this.props.navigation.setParams({navigatePress:this.clickFinishButton})
}
  // 点击完成按钮
clickFinishButton = ()=> {
alert('哈哈');
// let data = this.state.dataArr;
// let selectResultArr = [];
// for (var index in data) {
// var element = object[index];
// if (element.isSelected) {
// selectResultArr.push(element);
// }
// }
// alert(selectResultArr.length);
}

React Native使用react-navigation时,设置navigationOptions中Static中使用this注意点的更多相关文章

  1. [RN] React Native 好用的时间线 组件

    React Native 好用的时间线 组件 效果如下: 实现方法: 一.组件封装 CustomTimeLine.js "use strict"; import React, {C ...

  2. React Native之React速学教程(中)

    概述 本篇为<React Native之React速学教程>的第一篇.本篇将从React的特点.如何使用React.JSX语法.组件(Component)以及组件的属性,状态等方面进行讲解 ...

  3. React Native之React速学教程(上)

    概述 本篇为<React Native之React速学教程>的第一篇.本篇将从React的特点.如何使用React.JSX语法.组件(Component)以及组件的属性,状态等方面进行讲解 ...

  4. 【React Native】React Native项目设计与知识点分享

    闲暇之余,写了一个React Native的demo,可以作为大家的入门学习参考. GitHub:https://github.com/xujianfu/ElmApp.git GitHub:https ...

  5. React Native之React速学教程(下)

    概述 本篇为<React Native之React速学教程>的最后一篇.本篇将带着大家一起认识ES6,学习在开发中常用的一些ES6的新特性,以及ES6与ES5的区别,解决大家在学习Reac ...

  6. React Native & react-native-web-player & React Native for Web

    React Native & react-native-web-player & React Native for Web https://github.com/dabbott/rea ...

  7. React Native之React Navigation踩坑

    自动重装系统之后,已经很长一段时间没有来写React Native了,今天空闲之余,决定重新配置React Native的开发环境,继续踩坑... React Native的开发环境配置狠简单,只要依 ...

  8. React Native 的高度与宽度设置

    React Native中的尺寸都是无单位的,表示的是与设备像素密度无关的逻辑像素点. import React, { Component } from 'react'; import { AppRe ...

  9. react native (2) 嵌入h5页面 设置顶部导航

    嵌入h5页面 1.新建好页面 2. import { WebView } from 'react-native'; 3.<WebView source={{ uri: '要引入的页面路径' }} ...

随机推荐

  1. Tarjan-CV/BCC/SCC算法学习笔记

    DFS性质的应用--利用Tarjan算法求割顶.BCC.SCC 整理自<算法竞赛入门经典--训练指南>以及网络 DFS (depth first search)深度优先搜索算法 dfs森林 ...

  2. SecureFX中文目录乱码问题解决方案

    1.点击菜单栏中Options 2.找到General下的Configuration Paths并点击 3.在我的电脑打开 右面视图Configuration data is stored in th ...

  3. 通信网络(CCF)【图的遍历】

    问题描述 某国的军队由N个部门组成,为了提高安全性,部门之间建立了M条通路,每条通路只能单向传递信息,即一条从部门a到部门b的通路只能由a向b传递信息.信息可以通过中转的方式进行传递,即如果a能将信息 ...

  4. scrollTop([val])

    scrollTop([val]) 概述 获取匹配元素相对滚动条顶部的偏移.广州大理石机械构件 此方法对可见和隐藏元素均有效. 参数 valString, NumberV1.2.6 设定垂直滚动条值 示 ...

  5. 小米 oj 硬币比赛(思维+动态规划)

     硬币比赛 序号:#47难度:困难时间限制:1000ms内存限制:10M 描述 有 n 个不同价值的硬币排成一条线.有 A 与 B 两个玩家,指定由 A 开始轮流(A 先手,然后 B,然后再 A..) ...

  6. hdu 4998 Rotate 点的旋转 银牌题

    Rotate Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 65536/65536 K (Java/Others)Total Subm ...

  7. [NOI2017]蚯蚓排队

    嘟嘟嘟 现在看来这道题还不是特别难. 别一看到字符串就想SAM 看到\(k\)很小,所以我们可以搞一个单次修改复杂度跟\(k\)有关的算法. 能想到,每一次断开或链接,最多只会影响\(k ^ 2\)个 ...

  8. 【csp模拟赛5】购物(shopping.cpp)--常规

    多项式,因为每次的x相同,所以把a和b相加就行了,然后找对称轴,找离对称轴最近的整数点,然而我却写了个暴力,没看x #include <iostream> #include <cst ...

  9. luogu3629

    P3629 [APIO2010]巡逻 题目描述 在一个地区中有 n 个村庄,编号为 1, 2, ..., n.有 n – 1 条道路连接着这些村 庄,每条道路刚好连接两个村庄,从任何一个村庄,都可以通 ...

  10. 利用pyltp进行实体识别

    一.实体识别作为信息抽取中基础的也是重要的一步,其技术可以分为三类,分别是其于规则的方法.其于统计模型的方法以及基于深度学习的方法. 基于规则的方法,主要依靠构建大量的实体抽取规则,一般由具有一定领域 ...