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 单线程的特点,我们要避免在同一时间做较多的作务, 例如动画渲染，接口请求，或是改变页面样式