Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

React Native Modal Not Closing

I'm overlaying the following Modal component in my iOS app while waiting for several async requests to come back.

<Modal transparent={true} visible={this.state.visible}>
    <View style={{flex: 1}}>
        <ActivityIndicator color="white" size="large"/>
    </View>
</Modal>

this.state.visible is set to false once all the requests have returned. However, about 50% of the time the modal remains on the screen indefinitely, even after the requests have come back. I've logged this.state.visible at the top of my render function and it is false as expected, yet the modal does not disappear. Any thoughts as to why this may be happening?

like image 885
Brandon Avatar asked Aug 22 '16 14:08

Brandon


People also ask

How do you close a modal react?

Now, when a user clicks the Tab marked Show the Modal! , they'll open up the Modal, and when they click the x or close buttons on the component the Modal will close. Easy-peasy. React-Bootstrap is one of many custom frameworks freely available to power-up our frontend development needs.


1 Answers

Perhaps it was the same problem I'm facing here.

I get this problem when closing one modal and opening another, some people are getting this with a modal and an alert...

https://github.com/facebook/react-native/issues/10471

For now, the solution is a timeout before the action (600ms should solve it).

like image 130
Eduardo Sganzerla Avatar answered Oct 10 '22 15:10

Eduardo Sganzerla