React Native Modal的onRequestClose属性详解

Modal大家都比较熟悉，关于它的onRequestClose属性到底是起什么作用,我们到底要不要实现它？

官方文档上要求Android平台必须实现，那是为什么呢？

/**
*“onRequestClose”属性允许传递一个函数，该函数将在模式被取消后调用。
*在Android平台上，这是一个必需的功能_
*/

 /**
     * The `onRequestClose` prop allows passing a function that will be called once the modal has been dismissed.
     * _On the Android platform, this is a required function._
     */
    onRequestClose?: () => void;

 

现在我们就来详解下这个属性：

这个属性其实监听的是安卓上的返回键，

在安卓4.0之前，安卓是有物理返回键的，

4.0之后提供了虚拟导航的功能，物理返回键不再存在，类似苹果一样的，只有一个home键，此时监听的就是虚拟的物理返回键，

5.0之后，安卓也开启了全面屏，但系统还是保留了虚拟导航的功能，用户可以通过系统设置去开启这个功能，但大部分手机出厂设置时默认是全面屏的，此时这个属性监听还是虚拟的物理返回键，前提是用户开启了虚拟导航的功能

综上所述：

4.0之前监听的是物理返回键，4.0之后监听的是虚拟物理返回键，总之这个属性监听的是安卓的返回键

 

我们怎么做？

针对这个属性，

1、我们严谨一点的做法应该是实现这个属性，在函数中实现关闭方法，这样在用户点击安卓返回键的时候，我们的遮罩层就会消失，

2、如果不实现这个属性，那么最糟糕的情况也就是用户点击返回按钮的时候，遮罩层不消失，不会有什么别的问题，

至于要不要实现这个方法，完全取决与产品设计了，看是不是有这个需求。

 

从大的方向看，

现在大部分安卓手机也都是默认全屏模式，和苹果的操作类似，换言之，大家的操作习惯逐渐变的统一，这个适配的意义也就不大了，但最终还是取决于产品设计

 

综上：

在使用Modal的时候我们严谨一点的做法还是要实现这个属性，确保点击安卓返回键的时候，能够正常关闭遮罩层

<Modal
                animationType="slide"
                transparent={true}
                visible={this.state.modalVisible}
                onRequestClose={() => {
                    this.setModalVisible(false)
                }}
            >