I have two pages A and B, I navigate from A to B by navigation, how can I update the content of A in B.
Both A and B have ViewModel
Related
I am trying to study React Navigation from the documentation and have read this quote
When going back from B to A, componentWillUnmount of B is called, but
componentDidMount of A is not because A remained mounted the whole
time.
Here is my question: Why was the WillUnmount called for the B component, but the WillUnmount was not called for the A component?
I know it is for the performance, but what pages are the WillUnmount calls for, and which pages are the WillUnmount calls not?
From above example, A is main screen and B is the second screen which was stacked over A, so think it like that A is still there and B is just over A, so when going back from B to A, B will be removed (unmounted) from that stack and hence WillUnmount of B will be called, but A is not removed from stack and WillUnmount of A won't called until we exit the app or put screen A stacked over another screen and going back.
I'm new to React Navigation and want to use it to control navigation across several screens which all fill the whole viewport, let's call them A, B and C.
One of these screens (B) needs to have several views which can be navigated between, let's call then B1, B2 and B3, but I want them to all have the same header and footer which stays exactly where it is and doesn't get re-instantiated.
So, when on screen B the portion in the middle needs to slide between 'screens' like a carousel (almost like a tab system without the tabs) and the whole thing could be transitioned back to A or C at any moment, destroying the sub-screens.
As far as I can tell from the docs there can only be one props.navigation in the app (using withComponent for example) So I don't think I can just use createStackNavigator on the main view then use it again to create another stack when on screen B.
Any guidance would be greatly appreciated.
I am using react-redux and react-native's navigation in my app. My goal is of navigate after successful API call from Screen A -> Screen B -> Screen C and so on.
This is what I'm doing in the app.
On Screen A, button is pressed, and an redux action is generated.
Action is internally calling an API and getting result and dispatching event to reducer state.
After reducer's state gets updated (Success cases), I wanted to navigate to Screen B.
Again same 1-3 steps for Screen B to Screen C.
I did tried following approaches:
Adding navigation code in componentWillReceiveProps:
Problem with this approach is, its calling all the componentWillReceiveProps of navigation stack. This is rendering current screen multiple times before navigating to next screen (I observed this behaviour from Screen B -> Screen C)
Adding navigation code render method itself and returning null.
Again problem here is, what if I have multiple reducer mapped in one screen. Again I will be navigating more than once if both reducer changes.
I thought of using EventListener's, but than I have to keep track of adding and removing them.
Any ideas on how can I achieve this.
Thanks
I have created two component ( A and B) and put it inside StackNavigator after that header set to null then it's header not showing . so i created custom header for B component with back arrow. so my question is when i push Component B from A and click Back Arrow then Component B will finished like android finish() method .
thanks
I use react-navigation with StackNavigatior to navigate through screens. I navigate from the screen A to screen B where I can select one option from a list of options.
After I press Done, I want to go back to screen A and see what option I selected in screen B.
How can I do that ?
I tried to pass the option selected to goBack() method, but it doesn't work.
If screen A is a parent of screen B, you can pass something like:
setScreenBOption: function (option) {
this.setState({screenBOption:option});
}
to screen B.
Then from screen B whenever the option is selected, you can call
this.props.setScreenBOption(thingThatWasClicked);
On screen A, you'd display this.state.screenBOption.
If screen A and screen B are siblings, you'd add the setScreenBOption function onto the parent of screen A and screen B and pass this.setScreenBOption down to screen B and this.state.screenBOption to screen A. On screen A, you'd display this.props.screenBOption.