On show and hide of modal, child component inside modal mount and unmount

[manoj2166]

Environment

Environment:
OS: macOS High Sierra 10.13.5
Node: 6.9.4
Yarn: Not Found
npm: 3.10.10
Watchman: 4.9.0
Xcode: Xcode 9.4 Build version 9F1027a
Android Studio: 2.2 AI-145.3537739

Packages: (wanted => installed)
react: ^16.3.1 => 16.4.1
react-native: ^0.55.0 => 0.55.4

Description

I am using graphQL for data query. There is modal which show listing of data with header, footer and listing in middle. Listing is child component of modal box, challenge is that on each time hide and show of modal box mount and unmount on listing component which will cause to delay response to show.

Could anybody help me about this to prevent this?

Reproducible Demo

            <Modal
            onRequestClose={this.props.onRequestClose}
            visible={this.props.isVisible}>
             <View style={{flex:1}}><ListingComponent/></View>
            </Modal>

[react-native-bot]

Have you been able to reproduce this on the latest release, 0.56?

[karanjthakkar]

@manoj2166 One of the ways that I can think of to avoid this issue is to fetch your data in a parent component, preferably the container of your Modal component. This way, you can pass the data to the ListComponent via props instead of loading inside it.

[manoj2166]

Hi @karanjthakkar, I have prevent to new request to server for new data but this actual problem is that we have lots of business logic on data listing like filter, sorting and many more so it is taking process to complete this, due to mount and unmount on every time of show and hide this is taking to time show.

[react-native-bot]

I am closing this issue because it does not appear to have been verified on the latest release, and there has been no followup in a while.

If you found this thread after encountering the same issue in the latest release, please feel free to create a new issue with up-to-date information by clicking here.

[BaderSerhan]

I have this issue too! I am trying to animate colors in the modal, but when it closes, the animation re-appears!