在我的反应原生项目中显示模态时显示吐司？

Question

在此处输入代码当我的模式在我的 react 本机项目中可见时，我想显示一个祝酒词。 我使用 react-native-modal。 我有一个模态按钮，当我按下它应该显示一个吐司 我不想将我的 toast 标签放在模态标签中 我该怎么办？？？

 render(){
    return(
      <>

      <Modal visible={this.state.visible}>
      <Toast
                    ref="toast"
                    style={{backgroundColor:'red'}}
                    position='bottom'
                    positionValue={100}
                    fadeInDuration={1000}
                    fadeOutDuration={1000}
                    opacity={0.8}
                    textStyle={{color:'blue'}}
       />
      <SafeAreaView style={{flex:1}}>
          <View style={{flex:1,justifyContent:'center',alignItems:'center'}}>
            <TouchableOpacity onPress={()=>this.refs.toast.show('hello world!')} style={{height:200,width:100,justifyContent:'center',alignItems:'center',backgroundColor:'blue'}}>
                <Text>Modal Button</Text>
            </TouchableOpacity>
          </View>
      </SafeAreaView>
      </Modal>
      <SafeAreaView style={{flex:1}}>
          <View style={{flex:1,justifyContent:'center',alignItems:'center'}}>
            <TouchableOpacity onPress={()=>{this.setState({visible:true})}} style={{height:100,width:100,justifyContent:'center',alignItems:'center',backgroundColor:'red'}}>
                <Text>button</Text>
            </TouchableOpacity>
          </View>
      </SafeAreaView>
      </>
    )
  }

实际上我想成为我的模态标签中的吐司，但是当模态可见时它会显示在屏幕顶部

Answer 1

react native modal 是原生视图，所以不可能被 js 组件覆盖。