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: '要引入的页面路径' }} ...
随机推荐
- config.json读取和存储
json格式的配置文件的读取和存储 public class ConfigHelper { public static T GetConfig<T>(string path) { if ( ...
- Atcoder Educational DP Contest 题解
A - Frog 1/B - Frog 2 入门... #include<cstdio> #define abs(a) ((a)>=0?(a):(-(a))) #define min ...
- ProjectEuler237 Tours on a 4 x n playing board
思路是这样的 插头dp-->打表-->OEIS查表-->通项公式-->矩阵快速幂优化线性递推 OEIS竟然有这个东西的生成函数啊 答案为15836928 这是最终代码 #inc ...
- BZOJ 2049: [Sdoi2008]Cave 洞穴勘测 (LCT维护连通性)
直接把x设为根,然后查询y所在联通块的根是不是x就行了. CODE #include <cstdio> #include <cstring> #include <algo ...
- 09 深科技相关表结构 (未完成)、git
1.深科技相关 1. 深科技表结构(6表) 深科技4张+2张用户表 - 深科技 用户表 用户Token 文章来源 文章表 通用评论表 通用收藏表 # ######################## ...
- java超大文件上传
上周遇到这样一个问题,客户上传高清视频(1G以上)的时候上传失败. 一开始以为是session过期或者文件大小受系统限制,导致的错误. 查看了系统的配置文件没有看到文件大小限制, web.xml中se ...
- 将.py脚本打包成.exe
https://www.cnblogs.com/wyl-0120/p/10823102.html 为了方便使用,通过pyinstaller对脚本进行打包成exe文件. pip3 install pyi ...
- 【HTTP】无状态无连接的含义
无连接:服务器处理完客户的请求,并收到客户的应答后,即断开连接. 早期这么做的原因是HTTP协议产生于互联网,因此服务器需要处理同时面向全世界数十万.上百万客户端的网页访问,但每个客户端(即浏览器)与 ...
- 「CF712E」Memory and Casinos「线段树」「概率」
题解 解法1:(官方做法) 一段区间的\(L\)定义为从最左边开始出发,最左不失败,一直到最右边胜利的概率,\(R\)定义为从最右边开始出发,最左不失败,又回到最右边胜利的概率 考虑一个区间\([l, ...
- jQuery系列(十):事件对象
1.事件对象 Event 对象代表事件的状态,比如事件在其中发生的元素.键盘按键的状态.鼠标的位置.鼠标按钮的状态. (1)什么时候会产生Event 对象呢? 例如: 当用户单击某个元素的时候,我们给 ...