CODEWITHSUNDEEP
react-native
jakbar
jakbar

Reputation: 99

Capturing click from included component in react-native?

I am trying to use 'react-native-popup-dialog' to include pop ups in my react-native app.

I have a component 'HeaderView' which I am including in all other components for example 'Home' as

<HeaderView/>.

For 'HeaderView' component I have set flex to 0.5 and there is a button whose onpress event I want to capture in 'Home' component.

onPress={() => {
            this.popupDialog.show();
}}

And PopupDialog exists in 'Home' Component. If I include PopupDialog in HeaderView, I get popup only in 0.5 (flex) part of screen.

Is there any way to achieve this or will I have to discard my HeaderView component and add its logic in all components?

Upvotes: 0

Views: 284

Answers (1)

Mohsen
Mohsen

Reputation: 1555

You can do that in so many ways.

As one of those you can use this:

Add some listener in the root of your app (e.g: App.js) and render popup dialog there, and finally show modal with emitting the listener. (react-native-event-listeners)

Another simple way is using ContextApi

But you should know that the best way is rendering your main modal in root and call the functionalities about that with some tools like the above examples or even something like redux.

Upvotes: 1

Related Questions