I am using react-navigation
. I am passing props
from a react-native component
to the modal
from react-navigation
There is really simple solution to pass back props to parent component on goBack()
.
You can pass an extra prop containing function to Modal and right before calling goBack()
or in componentWillUnmount
you can call that function.
Example
export default class SomeComp extends Component {
...
onGoBack = (someDataFromModal) => {
console.log(someDataFromModal);
}
render() {
const { navigate } = this.props;
return (
<TouchableOpacity
onPress={navigate("Modal", {data: ..., ..., onGoBack: this.onGoBack})}
..../>
)
}
}
export default class Modal extends Component {
...
componentWillUnmount() {
if(this.props.navigation.state.params.onGoBack) {
this.props.navigation.state.params.onGoBack('I fired from Modal!');
}
}
render() {
const { data, ... } = this.props.navigation.state.params;
const { goBack } = this.props.navigation;
return (
<View>
<TouchableOpacity
onPress={goBack()}
..../>
<Text>
{data, ...}
</Text>
</View>
)
}
}