javascript - react-native modal 后面的元素不可点击

Question

这里有点困惑。我创建了一个模态组件，并在容器(父)中调用该模态。在这里，当我的模式弹出时，我努力使容器(父级)中的其他组件可点击。

我已经设置了我的模态高度和宽度:

<Modal transparent={false}
       visible={this.state.isVisible}
       onRequestClose={this.closeModal}>
  <View style={{
          flex: 1,
          flexDirection: 'column',
          justifyContent: 'center',
          alignItems: 'center'}}>
    <View style={{
            width: 300,
            height: 300}}>
      ...
    </View>
  </View>
</Modal>

但是还是不行。请帮忙。

Answer 1

我认为这就是它的工作原理!来自 react-native 的 modal 会填充孔屏幕，即使您放置了高度和宽度，也只有内部 View 具有模态全屏的尺寸。要解决这个问题，您可以创建自己的模态。只需创建一个具有绝对位置的组件并在您的父级中调用它。

{this.state.isVisible?<ModalComponent />:null}