模态道具onDismiss在Android上

时间:2019-03-28 14:08:29

标签: reactjs react-native

我一直在寻找Modal上onDismiss道具的替代品,Android上不支持它。我需要在功能完全关闭后立即触发

    <CustomModal
      title={titleModal}
      openModal={openModal}
      onDismiss={this.setValueWhenClosed}
      closeOutside
    >

2 个答案:

答案 0 :(得分:0)

对我有用onDismiss不支持android,因为我编写了自己的close和open函数

import React, { Component } from "react";
import { Modal, Text, TouchableHighlight, View, Button } from "react-native";

export default class ModalExample extends Component {
  constructor(props) {
    super(props);
    this.state = {
      modalVisible: false
    };
  }

  setModalVisible(visible) {
    this.setState({ modalVisible: visible });
    alert("Show" + this.state.modalVisible);
  }

  closeModal = () => {
    this.setState({ modalVisible: false });
    alert("Close" + this.state.modalVisible);
  };

  render() {
    return (
      <View style={{justifyContent:"center",alignItems:'center' }}>
        <Modal
          animationType="slide"
          transparent={false}
          visible={this.state.modalVisible}
          onRequestClose={() => {
            alert("Modal has been closed.");
          }}
        >
          <View style={{justifyContent:"center",alignItems:'center' }}>
            <View>
              <Text>Hello World!</Text>

              <TouchableHighlight
                onPress={() => {
                  this.setModalVisible(!this.state.modalVisible);
                }}
              >
                <Button
                  onPress={this.closeModal}
                  title="Close Modal"
                  color="#841584"
                />
              </TouchableHighlight>
            </View>
          </View>
        </Modal>

        <TouchableHighlight
          onPress={() => {
            this.setModalVisible(true);
          }}
        >
          <Text>Show Modal</Text>
        </TouchableHighlight>
      </View>
    );
  }
}

答案 1 :(得分:0)

我认为最好的选择是使用react-native-modal,然后您可以使用 onModalHide 信息流来了解模态是否已被隐藏。