javascriptreact-nativemodal-dialogreact-native-modalreact-native-tab-view

Open modal inside react-native-tab-view


I want to show some data in Modal, I need to use modal inside of tab view

react-native-tab-view
react-native-modal

but when i add modal inside of tab view then initially modal is render every time and cannot be dismissed. I already tested using modal in different way...

  1. Inside of file
  2. outside of file
  3. Inside of Function
  4. using as a component

every time Modal render first and cannot be dismissed.


Solution

  • The best way to achieve that is by using a Global Modal.

    At first, create a folder called connected-components and create your modal as in this example

    Use your reducer engine to change visible value by creating two actions one to show the modal and another to hide it, You can also pass your custom data using the reducer.

    To make it work just add your Global Modal component to your App.js and by this way you can open it from every place on your app.

    If you have any questions just add a comment, Hope this help you through.