解决React-Native IOS Toast 被Modal覆盖的问题

/**
 * 通用Toast弹窗处理
 * 说明：
 * 1、之所以不用react-native-easy-toast，是因为在react-native-modalbox打开
 *    的情况下，toast的层级没有modal高，会被覆盖掉。
 * 2、为了防止父组件的modal里有input键盘输入，最好在父组件modal调用接口时，
 *    用Keyboard.dismiss()，先将键盘隐藏掉，这样可以防止toast位置的抖动。
 * 3、父组件通过onRef回调的方法获得子组件的this, 如下
 *   <Toast onRef={toast => this.toast = toast}/>
 *   通过this.toast.show('hello world')使用。
 */

/**
 * 通用Toast弹窗处理
 * 说明：
 * 1、之所以不用react-native-easy-toast，是因为在react-native-modalbox打开
 *    的情况下，toast的层级没有modal高，会被覆盖掉。
 * 2、为了防止父组件的modal里有input键盘输入，最好在父组件modal调用接口时，
 *    用Keyboard.dismiss()，先将键盘隐藏掉，这样可以防止toast位置的抖动。
 * 3、父组件通过onRef回调的方法获得子组件的this, 如下
 *   <Toast onRef={toast => this.toast = toast}/>
 *   通过this.toast.show('hello world')使用。
 */
import React from 'react';
import {
  StyleSheet,
  Text,
  View,
  Modal, Platform
} from 'react-native';

export default class MyToast extends React.Component {
  constructor(props) {
    super(props);
    this.state = {
      duration: 1800, // 模态框持续时间
      modalTxt: '',
      visible:false
    }
  }
  componentDidMount() {
    const { onRef } = this.props;
    if (typeof onRef === 'function') onRef(this);
  }
  // 模态框打开，过一段时间再消失
  show = (modalTxt) => {
    this.setState({modalTxt:modalTxt,visible:true});
    setTimeout(() => {
     this.setState({
       visible:false
     })
    }, this.state.duration);
  }
  render() {
    return (
      <Modal

        onRequestClose={Platform.OS != "ios" ? this._onRequestClose : null}
        animationType={'fade'}
        transparent={true}
        visible={this.state.visible}
      >
        <View
          style={styles.modal}
        >
        <View style={styles.modalContent}>
          <Text style={styles.modalTxt} >{this.state.modalTxt}</Text>
        </View>
        </View>
      </Modal>
    );
  }
}

const styles = StyleSheet.create({
  modal: {
    flex:1,
    backgroundColor: 'transparent',
    flexDirection:'column',
    alignItems: 'center',
    justifyContent: 'center',
  },
  modalContent: {
    flexDirection:'row',
    justifyContent:'center',
    alignItems:'center',
    backgroundColor: '#00000088',
    borderRadius:15,
    paddingHorizontal:20,
    alignSelf:'center',
    marginTop:100
  },
  modalTxt: {
    color: '#fff',
    textAlign:'center',
    backgroundColor:'#0000',
    lineHeight:30
  }
});