react-native开发React Native开发经验集React-Native 开发阵营

react-native初学遇到的小case

2017-02-18  本文已影响111人  竿牍

请用一句话形容程序员的苦逼,答:“不在办公室码代码,那肯定在家码代码”
不吐槽了,直接说事。

1,react-native调用原生的方法,怎么调用?戳这里http://reactnative.cn/docs/0.41/native-modules-android.html
当你写好代码后,因为你动了原生android代码,所以你要重新命令行react-native run-android
报错:outDexFolder must be a folder
解决办法:在android studio中clean一下,
再次运行
报错:Failed to create D:\react-native\app_project\RNAndroid\android\app\build\intermediates\debug\merging
解决办法:在android studio中clean一下,
再次运行
BUILD SUCCESSFUL

2,自定义组件时,文件名与定义的class名要一致
例如:文件名是HomeUI.js
export default class HomeUI extends Component{

}
否则报错,
引入自定义组件用import
import HomeUI from './app/components/HomeUI';
建议不要用require
var HomeUI = require('./app/components/HomeUI');
可以参考ECAMScript6 http://es6.ruanyifeng.com/#docs/style

屏幕快照 2017-02-18 17.16.00.png

3,打开android studio后,提示更新Gradle ,如果大家的环境是好的,最好不急更新,我点了更新后,运行react-native run-android就出现下面情况:

WX20170218-174231@2x.png

解决办法:
Well, I meet the same problem. I use this method solve it.
sudo react-native run-android

but...

WX20170218-183938@2x.png

搞过android的同学们应该知道怎么解决了,
就是把app卸载,再重新运行:react-native run-android

BUILD SUCCESSFUL

4,React Native ListView的Item设置点击事件时null is not an object(evaluating '_this3._pressRow')
<ListView
renderRow={this._renderRow}
/>
最好用bind的写法

<ListView 
renderRow={this._renderRow.bind(this)}
                />

renderRow={this._renderRow.bind(this)}通过bind方法把this传递给_renderRow方法
_renderRow(rowData) {
        return (
            <TouchableOpacity 
              onPress = {() =>this._pressRow(rowData)} >
            .............
            </TouchableOpacity>
        )
    }

这样_renderRow就使用this就不会报这个错了。

上一篇下一篇

猜你喜欢

热点阅读