React Native 坑点采集, 你中招了吗

务必注销监听事件

Page A
	componentWillMount() {
		this.subscription = DeviceEventEmitter.addListener("toggleEditMode", () => { 
      alert('registry a event listenr'); 
    });
	}
  第一次进入 Page A:
  alert('registry a event listenr')
  第二次进入 Page A:
  alert('registry a event listenr') X 2

  缘由: RN 并不会自动注销咱们注册的事件, 须要手动注销
  方法: 在 componentWillUnmount 生命周期中手动注销, 而且注销时注意先判断存在此事件, 再执行 remove 方法
  componentWillUnmount() {
    // 注销 subscription 事件的监听
    this.subscription && this.subscription.remove();
  }
复制代码

禁止字体随系统字体一块儿放大

在调整过系统字体的 RN 项目中, 页面中的字体会跟随系统字体一块儿变化, 咱们须要调整组件属性:
  TextInput.defaultProps = Object.assign({}, TextInput.defaultProps, { defaultProps: false });
  Text.defaultProps = Object.assign({}, Text.defaultProps, { allowFontScaling: false });
复制代码

捕获全局错误 保障 App 稳定度

有时候一些莫名的错误会发生, 但咱们又不能及时定位, 借助这个语句有助于捕获全局错误
  // 捕获全局错误
  require('ErrorUtils').setGlobalHandler(err => { });
复制代码

屏蔽 黄色警告 与 三指滑动

console.disableYellowBox = true // 关闭所有黄色警告
  console.reportErrorsAsExceptions = false // 屏蔽三指操做 (某些支持三指操做的机型可能会崩溃)
复制代码

在互动和动画的过程当中避免繁重的操做

为了不在 互动和动画的过程当中产生繁重的操做, 让 JS 在执行完动画的做务后再去执行 其它逻辑
  	componentDidMount() {
      InteractionManager.runAfterInteractions(() => {
        // 初次访问页面时切换 选项卡
        this.handleChangeTab('Usual');
        // 加载文章数据
        this.loadUsualData();
      });
    }

    使用 setImmediate 或 requestAnimationFrame 来避免繁重做务调度:
    setImmediate(() => {
      this.loadUsualData();
      ...
      ...
    });
    或
    requestAnimationFrame(() => {
      this.loadUsualData();
      ...
      ...
    });

    基于 JS 单线程的特色,咱们要避免在同一时间作较多的做务, 例如动画渲染，接口请求，或是改变页面样式
复制代码