ReactNative 踩坑小计
- 使用ES6語法編寫Component時綁定事件需要用this.MethodName.bind(this),否則MethodName中無法使用this
<TouchableHighlight onPress={this.onPressButton.bind(this)}>
<Text>Test</Text>
</TouchableHighlight> - 使用ES6語法編寫方法,需要調用同類中的方法時,需要添加this前綴,否則會出現無法找到function錯誤
getSomeVar(){
return this.someVar;
}
testMethod(){
return this.getSomeVar();
} - node_gyp
有些npm安裝包需要node_gyp,此程序需要先安裝python, 且只支持2.7版本 ,3.X是不支持的,安裝時注意將安裝目錄添加至PATH選項,如未勾選請自行加上 - 運行github上面的項目example步驟:
1.進入項目example目錄運行npm install
2.運行 react-native upgrade
3.如遇到__DEV__ is not defined 錯誤,請移除.babelrc裏的"presets": ["react-native"] - ListView刷新行數據需要注意點【PressRow】:
1.新數據集需要先克隆
2.修改行數據為對象時需要采用對像方式賦值,而且不是obj.propTest='Value'
3.更新數據源採用this.setState方法pressRow(rowData, rowID){
let newArray = this.state.itemData.slice(); //數組複製
newArray[rowID] = { //對象式賦值
...this.state.itemData[rowID],
ChangeValue: 'TestValue',
};
this.setState({ //更新數據源
itemDataSource: this.state.itemDataSource.cloneWithRows(newArray),
});
}
- 當ListView的dataSource數據來源為對像數組時,刷新整個數據需要對數組重新賦值,否則不會刷新頁面:
方法1:let newArray=this.state.data.slice();
for (var i = 0; i < newArray.length; i++) {
newArray[i]={
...this.state.data[i],
};
}
this.setState({
dataSource:this.state.dataSource.cloneWithRows(newArray),
});方法2:
let newArray=JSON.parse(JSON.stringify(this.state.data));
this.setState({
dataSource:this.state.dataSource.cloneWithRows(newArray),
});
- 調試anrdoid時有時候Reload JS無效,這時候請關閉原來的JS Running窗口,執行 react-native start試試
- 導入Class時需要注意導入類是否包含defalut,default為不帶括號,非default需要帶括號,否則有可能會引起錯誤
import Games from './views/Games';
import {Login} from './views/Login'; export default class Games extends Component {
..........
} export class Login extends Component {
} - ES6类中constructor 引用静态变量不会执行 New实例的时候会执行。
- 第一个页面有獲得焦點的TextInput控件时,須在轉到第二個頁面前取消焦點,否則轉到第二个页面为Listview时绑定行必须要点两次才会触发
注:用的是react-native-router-flux 中的 Actions.pageKey()方法. - react-native-store用for删除多笔带条件数据时,需要添加async和await,否则只会删除第一笔
static async clearCart(items){
for (let item of items) {
await DB.Cart.remove({
where:{
and:[{id:item.ID}]
}
});
}
}
ReactNative 踩坑小计的更多相关文章
- Linux/Docker 中使用 System.Drawing.Common 踩坑小计
前言 在项目迁移到 .net core 上面后,我们可以使用 System.Drawing.Common 组件来操作 Image,Bitmap 类型,实现生成验证码.二维码,图片操作等功能.Syste ...
- flutter 踩坑小计: amap_base 地图缩放 zoom 设置无效的问题
这种问题估计也就我这种菜鸡能遇到了,因为我问了一些大佬,他们完全没遇到这类的问题. 如果你也遇到了,希望这篇文章能帮到你,倘若还不能解决你的问题,可以留言,我们共同研究. 问题:同样的插件,为什么偏偏 ...
- React-Native 踩坑过程
踩坑过程: 解决方法就是去 SDK Manager 把 23.0.1 的版本下载了 而如果报错信息中含有bintray.com.gradle.org等网址,请***,反复重试,或者去react nat ...
- react-native 踩坑记
最近在使用react-native的时候遇到了很多坑,这里给大家分享下 一.样式 react-native 虽然支持flex布局,但是所有的样式均是css样式的一个很小的集合,尤其是在安卓机下问题尤为 ...
- ReactNative踩坑日志——OnPress随着render()执行被自动调用?
在ReactNative中,Text.Button以及其他Touchable包装成的可点击控件,都可以通过onPress属性为其指定点击时的响应函数. 在有些情况下,我们会把这些点击函数先定义好,然后 ...
- ReactNative踩坑日志——使用async/await语法解决网络请求的异步导致的指令执行顺序错乱问题
转载请注明原文地址: ReactNative的fetch是天然的异步请求,因此,如果你在一个代码块中使用了fetch,那么在执行的时候程序不会等待网络响应结束才执行下一条代码,而是会直接按顺序执行完整 ...
- ReactNative踩坑日志——代码执行方式(面向对象)
在ReactNative中,是以面向对象的方式执行代码的.处于同一{}內的代码以对象的形式执行,也就是说,程序虽然会自上而下执行代码,但是它会保证当前整个代码块內的语句执行完毕才执行下一代码块. 举个 ...
- ReactNative踩坑日志——如何实现删除scrollview中的视图
在reactNative中,页面是根据state值的变化来重新渲染的.因此,传统的前端开发中通过 id 来移除一个页面元素的做法在这里不适用. 一般,我们是通过遍历数组或map来渲染出scrollvi ...
- React-Native踩坑记录二
1.Image组件的borderRadius画圆有平台兼容性问题,在IOS下会失效 解决方法有几种 (1)在外面包裹一层View,对View组件使用borderRadius就可以了,这是我的做法 (2 ...
随机推荐
- 【原创】中文分词系统 ICTCLAS2015 的JAVA封装和多线程执行(附代码)
本文针对的问题是 ICTCLAS2015 的多线程分词,为了实现多线程做了简单的JAVA封装.如果有需要可以自行进一步封装其它接口. 首先ICTCLAS2015的传送门(http://ictclas. ...
- Samba 4.x.x全版本存在命令执行漏洞
Samba 4.0.0到4.1.10版本的nmbd(the NetBIOS name services daemon)被发现存在远程命令执行漏洞.CVE编号为CVE-2014-3560.目前官方已经发 ...
- Asp.Net生成RSS方法
一.RSS简介 什么是RSS? RSS是一种网页内容联合格式(web content sydication format). 它的名字是Really Simple Syndication的缩写. RS ...
- iOS 静态类库项目的建立与使用
iOS 静态类库项目的建立与使用 新建 Xcode workspace 打开 Xcode , 选择 File -> New -> Workspace , 将 Workspace 命名为 ...
- Sublime-text markdown with Vim mode and auto preview
说明 最近看到markdown相关的东西,被其书写方式吸引,其实以前就在找这种类似的工具,但是也没找到,由于习惯了Vim,可Vim不支持markdown预览,这点可能不是很好,于是找到Sublime- ...
- 264分析两大利器:264VISA和Elecard StreamEye Tools
学了264有将近3个月有余,好多时候都在学习老毕的书和反复看JM86的代码,最近才找到264分析两大利器:264VISA和Elecard StreamEye Tools.不由得感叹,恨不逢同时. 简单 ...
- 【转】cocos2d-x 3.2 Fast TileMap
概述 在游戏中常常会有丰富的背景元素,如果直接使用大的背景图实现,这会造成资源浪费.TileMap就是为了解决这问题而产生的.Cocos2d-x支持使用Tile地图编辑器创建的TMX格式的地图. Co ...
- JS调试必备的5个debug技巧
我一直使用printf调试程序,一般来说都是比较顺利,但有时候,你会发现需要更好的方法.下面几个JavaScript技巧相信你一定会觉得十分有用 1. debugger; 我以前也说过,你可以在J ...
- 使用carrierwave出现MiniMagick::Invalid错误的解决方法
安装Imagemagick不能从源码安装,要从软件市场安装,否则会出现错误:MiniMagick::Invalid 使用make uninstall卸载后,重新在软件市场里安装,问题解决.
- Source Insight中文乱码
搜索都是c++的代码,本来想下一个Vc,想了下,决定下个eclipse for C++,anyway,n次n久时间下载失败后,我接受了推荐,先下了个Source Insight来看代码.然后问题就出现 ...