react-native开发避坑

紫Young菌
618 阅读2分钟

1、无法在机器上安装软件 打开 android/build.grade, 更改路径 'com.android.tools.build:gradle:2.2.3' 到路径 'com.android.tools.build:gradle:1.2.3'

然后找到 android/gradle/wrapper/gradle-wrapper.properties, 改变路径 services.gradle.org/distributio…

国产系统的问题，会多做一层，要设置gradle

2、端口占用问题 大部分RN占用8081端口

3、红屏报错问题 真机

  • 确保设备已连接
  • 执行 adb devices
$ adb devices
List of devices attached 

emulator-5554 offline   # Google模拟器

14ed2fcc device         # 真实设备

如上，已经有设备链接'14ed2fcc device'

  • 首先确保你的电脑和手机设备在同一个Wi-Fi环境下。
  • 在设备上运行你的React Native应用。和打开其它App一样操作。
  • 你应该会看到一个“红屏”错误提示。这是正常的，下面的步骤会解决这个报错。
  • 摇晃设备，或者运行adb shell input keyevent 82，可以打开开发者菜单。
  • 点击进入Dev Settings。
  • 点击Debug server host for device。
  • 输入你电脑的IP地址和端口号（譬如10.0.1.1:8081）。在Mac上，你可以在系统设置/网络里找- 查询你的IP地址。在Windows上，打开命令提示符并输入ipconfig来查询你的IP地址。在Linux - 上你可以在终端中输入ifconfig来查询你的IP地址。
  • 回到开发者菜单然后选择Reload JS。
  • 更改相关文件路径

模拟器（genymotion） blog.csdn.net/Wbiokr/arti…

4、二维码调用问题 执行命令行如下

配置参考如下链接： blog.csdn.net/baidu_36259…

上面这个是原因一般是未在定义的类中，添加构造函数，这是es6语法规范 也有可能是加载模块的时候，由于同路径下，需要带 './'这个前标志

文件打包编译的过程中，由于文件重复可能会无法生成对应的文件，这时候可以做一下清理，gradlew clean

5、生命周期

  • constructor 构造函数，初始化需要的state
  • componentWillMount 控件渲染前出发
  • render 渲染控件的方法
  • conponentDidMount 空间渲染后触发
  • componentWillReceiveProps 组件接收到新的props时被调用
  • shouldComponentUpdate 当组件接收到新的props时被调用
  • componentWillUpdate props或者state改变，并且此前的shouldComponentUpdate方法返回为true会调用该方法
  • componentDidUpdate 组件重新渲染完成后会调用此方法
  • componentWillUnmount 组件卸载和销毁之前被调用
avatar
文章
阅读
粉丝