score:0
as terrance suggested. you can use a callback in the props and fire it before pop back to the previous page
answer source: react native pass properties on navigator pop
score:0
i was working on similar thing which i wan't to poptotop and pass some params when i came back to top of the stack.
here how i did it in react navigation 5 :-
props.navigation.reset({ // i did reset my stack using navigation.reset() instead of using poptotop
index: 0,
routes: [
{
name: "home", //name of screen which you wan't to come back to it
params: { isdialogopen: true }, // params you wanna pass to the screen
},
],
});
score:1
i have been working on this and i achieved with react-navigation
.
basically, your component a will send to component b the navigation state of component a. so, for b point of view it will be the prevstate before stacking b component.
so when component b navigates "back" to component a using the previous navigation state it was like your navigation state never changed and now you could use the second parameter of navigate
to send params back to component a.
this simple example illustrate this practice and i think it is totally valid and no asyncstorage
usage.
// in component a use a custom prevstate when goes to component b
const { navigation } = this.props;
navigation.navigate('componentb', { prevstate: navigation.state });
// in component b use this custom goback to "pop" to last screen
function goback(data) {
const { navigation } = this.props;
const { routename, key } = navigation.getparam('prevstate');
navigation.navigate({ routename, key, params: data });
}
// and finally in component a again you could get data like this
function getdatafromcomponentb() {
const { navigation } = this.props;
// it is null if no parameters are specified!
return navigation.state.params;
}
score:7
i found a good solution is to send a callback function with the params
in screen a
getback(success)
{
alert(success);
}
navigation.push(this.props.componentid , { component : {
name : "payment",
passprops: {
subscription : current,
getback: this.getback
},
}});
then in screen b , when you pop to screen a fire the getback function
navigation.pop(this.props.componentid);
this.props.getback(true);
this worked well with me
Source: stackoverflow.com
Related Query
- How to pop to the previous screen with params?
- How to fix the white screen after build with create-react-app?
- How do I call setState with the previous state plus an additional value in a redux connected controlled component?
- React. How to update the state with previous state?
- React Router V4: How to render a modal in the same screen changing only the url and then with that url, be able to rebuild the whole screen
- How to use nested routes to add content to a page without removing the content of the previous route with react-router-v4?
- How do I show the Google passport oAuth consent screen in the react frontend, not with express views template
- How can I get the params from the url with React?
- How do I combine two arrays in react to get a new one with all of the items from the previous two?
- .htaccess How to redirect to index.html with params but the param value is same as a folder name
- How to change the state when going to previous or next page with React?
- How to set the params react router not misunderstand with the static router?
- How to define TypeScript types when used with React useState and the previous state inside a state updating function?
- How to update the current state with current and previous state with react hooks
- With React Router v4, how to navigate to a path based upon the existing browser location but with new params interpolated?
- How to go back to the previous url without query params in react router
- How to create a button that opens a new page with the option to return back to previous page [ReactJS
- State in Reactjs holding the previous state value, how to update the state with new edited form value
- react-router v3: How to load data for the component when the same route with different query params is loaded
- How to combine the previous data with the new data in React and display it at the same time
- How to fix Error: Rendered more hooks than during the previous render when using SWR with useEffect
- How can I define a background image to fill the screen and remove edges on the left and right in React with Material UI?
- React Server Side Rendering - how to render from the server with :productId params passed in?
- How to remove the previous screen on the tab navigator - React Navigation v5
- How to pass params with history.push/Link/Redirect in react-router v4?
- With useEffect, how can I skip applying an effect upon the initial render?
- How to test a className with the Jest and React testing library
- How to change the value of a Context with useContext?
- How to fetch the new data in response to React Router change with Redux?
- How to mock history.push with the new React Router Hooks using Jest
More Query from same tag
- React: Route is not working inside of loop
- Cannot do routing within Redux Observable epic
- How to switch between sibiling in react
- React: How to shift focus using arrow keys? (TreeView)
- How to update a state, by taking reference of other state
- How can I make an add or remove input fields in react
- React Hooks SetState Method isn't updating the state at all
- how to display data on click react
- Weird behavior on array map after state update
- What is the best possible way to pass data between child components in React?
- How to chaincall functions in useEffect more elegantly
- Hide mobile browser's address bar on load (IOS / Android) in React
- Javascript react - using createSlice and encountering 'property assignment expected' / 'Declaration or statement expected'
- How to handle fetch API AJAX response in React
- Upload files in React JS
- Does React js use web-pack for make build before npm eject
- React components as instances like in OO programming
- Form submitting in Meteor with React
- How to consecutively add values from one array to another and store the value in a new array in javascript?
- Dynamically assigning values in AJAX js calls
- Can't change State from child component even after passing a function from parent component
- Difference between React controlled component and uncontrolled component
- React.js Problem to sent props and event from parent to child
- Warning: Each child in an array or iterator should have a unique "key" prop
- How to send values from api after maping react hooks
- How do I override compiled classes?
- What do triple brackets (i.e. {{{ stuff }}}) mean in Javascript/Typescript?
- Using ReactJS with NodeJS
- ReactJS re-render does not reset input fields
- Is there a way to access a function returned by a React component through a parent HTMLDivElement?