"react-native-loading-spinner-overlay" is not working when modal is open in iOS

Question

"react-native-loading-spinner-overlay" is not working when modal is open in iOS. If I set modal visible to false, it works. (Android is working well in any case.) That is my code.

When modal is open, if I click upload button on modal,

  _onUpload = () => {
    this.setState({ isLoading: true }) //-----> Loading spinner is not working.
  }

If I make like this

  _onUpload = () => {
    this.setState({ modalVisible:false })  //-----> After modal turns off
    setTimeout(() => {
      this.setState({ isLoading: true })   //----> Loading spinner works.
    }, 500);
  }

render

  render() {
    return (
      <View>
        <Spinner
          visible={this.state.isLoading}
          textContent={'Loading...'}
          textStyle={{ color: 'white' }}
        />
      </View>
    )
  }

I used modal from 'react-native-modal'

import Modal from 'react-native-modal';

<Modal
  isVisible={modalVisible}
  backdropColor="#B4B3DB"
  backdropOpacity={0.8}
  animationIn="zoomInDown"
  animationOut="zoomOutUp"
  animationInTiming={1000}
  animationOutTiming={1000}
  backdropTransitionInTiming={1000}
  backdropTransitionOutTiming={1000}>
  <View style={styles.modalBody}>
    <TouchableOpacity onPress={() => this._onUpload()} >
      <Text>Upload</Text>
    </TouchableOpacity>
  </View>
</Modal>

Why it is not working on only iOS?

How to make it work on iOS when modal is open?

Answer 1

Add a timeout to wait for the first Modal to close.

         setTimeout(() => {
           setstate({modalVisible:true})
         }, 2000);