ReactNative中返回事件的处理

返回事件场景描述：

场景一：
项目中使用naviator路由，返回上一级页面需要触发上一级页面的componentDidMount钩子函数。（包含手势返回和物理按键返回）
场景二：
当前页面中弹出安全警告Modal，用户需要勾选弹窗上的“已完成阅读“后才可以返回上一级页面。（不可以通过势返回和物理按键返回）

思路分析：

场景一：
正常情况下：页面由一级页面跳转到二级页面，就是将二级页面盖在了一级页上面，此时返回一级页面，这个过程对一级页来说是无感的，自然就无法触发componentDidMount函数。可用RN中的DeviceEventEmitter注册监听事件，需要触发的时候通过emit触发。同时还要通过BackHandle方法，监听手势返回和物理按键返回。
场景二
用户只有勾选，才可以通过手势和物理按键进行返回操作，可以判断勾选的状态，在没有勾选时将手势返回和物理按键返回禁用掉。

解决方案：

场景一

首先在一级页面注册一个监听函数，二级页返回时就可以触发这个函数。

// 一级页
componentDidMount() {
    this.listenerPage1 = DeviceEventEmitter.addListener('page1', params => {
    // 此处执行相应的逻辑操作，params表示接受的参数，可不写。
    console.log(params) // '传递进来的参数'
  }
  componentWillUnmount() {
    this.listenerPage1.remove();
  }

接着在二级页面中触发一级页中的函数

// 触发一级页面中的函数
DeviceEventEmitter.emit('page1', '传递进来的参数');

此时在点击界面上的返回按钮就可以触发上个页面的componentDidMount事件。接下来将和BackHandle方法结合，来监听手势返回和物理按键返回。

BackHandler.addEventListener('hardwareBackPress', () => {
 		// 进行限制，不然多级页面会出问题
        if (page === 2) {
          DeviceEventEmitter.emit('page1', '传递进来的参数');
        }
      });

注意：
BackHandler是全局的，项目中如果有多级页面，无论在哪一级页面返回都会触发此处的hardwareBackPress，因此需要if来进行判断，只有满足需要的条件才会触发。

场景二
主要是禁用手势返回和物理按键返回，回调函数返回一个true就可以阻止默认行为。

需要注意此处弹窗使用Modal来实现，可以直接添加onRequestClose回调，RN会自动阻止BackHandler事件。