React Native使用react-navigation时,设置navigationOptions中Static中使用this注意点
使用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注意点的更多相关文章
- [RN] React Native 好用的时间线 组件
React Native 好用的时间线 组件 效果如下: 实现方法: 一.组件封装 CustomTimeLine.js "use strict"; import React, {C ...
- React Native之React速学教程(中)
概述 本篇为<React Native之React速学教程>的第一篇.本篇将从React的特点.如何使用React.JSX语法.组件(Component)以及组件的属性,状态等方面进行讲解 ...
- React Native之React速学教程(上)
概述 本篇为<React Native之React速学教程>的第一篇.本篇将从React的特点.如何使用React.JSX语法.组件(Component)以及组件的属性,状态等方面进行讲解 ...
- 【React Native】React Native项目设计与知识点分享
闲暇之余,写了一个React Native的demo,可以作为大家的入门学习参考. GitHub:https://github.com/xujianfu/ElmApp.git GitHub:https ...
- React Native之React速学教程(下)
概述 本篇为<React Native之React速学教程>的最后一篇.本篇将带着大家一起认识ES6,学习在开发中常用的一些ES6的新特性,以及ES6与ES5的区别,解决大家在学习Reac ...
- 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 ...
- React Native之React Navigation踩坑
自动重装系统之后,已经很长一段时间没有来写React Native了,今天空闲之余,决定重新配置React Native的开发环境,继续踩坑... React Native的开发环境配置狠简单,只要依 ...
- React Native 的高度与宽度设置
React Native中的尺寸都是无单位的,表示的是与设备像素密度无关的逻辑像素点. import React, { Component } from 'react'; import { AppRe ...
- react native (2) 嵌入h5页面 设置顶部导航
嵌入h5页面 1.新建好页面 2. import { WebView } from 'react-native'; 3.<WebView source={{ uri: '要引入的页面路径' }} ...
随机推荐
- js动画fireworks烟花
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- python+Appium自动化:屏幕截图
屏幕截图 主要是为了程序出现错误时,开发除了可以分析日志之外,还可以进行截图更好地去定位问题. 截图一般有两种方法: 第一种save_screenshot(self,filename) driver. ...
- AGC刷题记
已经刷不了几天了... AGC001 A-BBQ Easy 排个序就过了 B-Mysterious Light 手膜一下,你会发现魔改一下\(gcd\)就行了 C-Shorten Diameter 刚 ...
- (三)wait()、notify()、notifyAll()
有新理解持续更新 轮询 线程本身是操作系统中独立的个体,但是线程与线程之间不是独立的个体,因为它们彼此之间要相互通信和协作. 想像一个场景,A线程做int型变量i的累加操作,B线程等待i到了10000 ...
- lnmp配置
yum源切换 下载wegt工具 yum install -y wget 备份 mv /etc/yum.repos.d/CentOS-Base.repo /etc/yum.repos.d/CentOS- ...
- 3 Servlet、Filter使用
1 使用Servlet获取数据 使用Servlet获取前端的数据,在后端从控制台中打印出前端的数据,前端页面如下图 前端页面程序:需要注意的是form的提交,以及input的不同类型对应的显示不同 & ...
- java中的变量和数据类型
变量和javascript的变量含义一样 在Java中,变量分为两种:基本类型的变量和引用类型的变量.(javascript中同样是这样的) 基本数据类型 基本数据类型是CPU可以直接进行运算的类型. ...
- oracle表查询
使用scott用户中存在的emp.dept表等做演示 一.单表查询 查看表结构:desc dept; 查看所有列:select * from dept: 查询指定列:select ename,sal, ...
- C#操作 Access 2013(.accdb)的方法
使用的Microsoft.Jet.OLEDB.4.0,的方法并不能连接最新的Access 存储文件,而且Microsoft.Jet.OLEDB.4.0不能使用x64的方式生成,而且使用这个数据库引擎效 ...
- python能用来做什么?这3大主要用途你一定要知道!(实用)
导读:如果你想学Python,或者你刚开始学习Python,那么你可能会问:“我能用Python做什么?” 这个问题不好回答,因为Python有很多用途. 但是随着时间,我发现有Python主要有以下 ...