How to re-render parent component React Native after update/edit in Child Component?
I get a problem to get new data in parent component (Profile) after update data in child component (ProfileEdit), here I create a simple script in order easy to understand, default component is Profile, why cannot show alert in Profile after back from ProfileEdit, please give advices or correct my script how to show alert after back from ProfileEdit.
Profile.js
export default class Profile extends Component {
componentDidMount() {
alert('Success');
}
toProfileEdit() {
this.props.navigation.navigate('ProfileEdit');
}
render() {
return (
<View>
<Button
onPress={() => this.toProfileEdit()}
title="Learn More" />
</View>
)
}
}
ProfileEdit.js
export default class ProfileEdit extends Component {
backTo() {
this.props.navigation.navigate('Profile');
}
render() {
return (
<View>
<Button
onPress={() => this.backTo()}
title="Learn More" />
</View>
)
}
}
Please anyone help me to solve this problem.
Thanks.
javascript reactjs react-native
asked Nov 13 '18 at 5:05
Frank AndrewFrank Andrew
388
add a comment |
I get a problem to get new data in parent component (Profile) after update data in child component (ProfileEdit), here I create a simple script in order easy to understand, default component is Profile, why cannot show alert in Profile after back from ProfileEdit, please give advices or correct my script how to show alert after back from ProfileEdit.
Profile.js
export default class Profile extends Component {
componentDidMount() {
alert('Success');
}
toProfileEdit() {
this.props.navigation.navigate('ProfileEdit');
}
render() {
return (
<View>
<Button
onPress={() => this.toProfileEdit()}
title="Learn More" />
</View>
)
}
}
ProfileEdit.js
export default class ProfileEdit extends Component {
backTo() {
this.props.navigation.navigate('Profile');
}
render() {
return (
<View>
<Button
onPress={() => this.backTo()}
title="Learn More" />
</View>
)
}
}
Please anyone help me to solve this problem.
Thanks.
javascript reactjs react-native
asked Nov 13 '18 at 5:05
Frank AndrewFrank Andrew
388
you need to do this stackoverflow.com/a/52732960/7462666
– Haider Ali
Nov 13 '18 at 6:19
Possible duplicate of react-native save button status after changing screens
– gparyani
Nov 13 '18 at 6:28
add a comment |
I get a problem to get new data in parent component (Profile) after update data in child component (ProfileEdit), here I create a simple script in order easy to understand, default component is Profile, why cannot show alert in Profile after back from ProfileEdit, please give advices or correct my script how to show alert after back from ProfileEdit.
Profile.js
export default class Profile extends Component {
componentDidMount() {
alert('Success');
}
toProfileEdit() {
this.props.navigation.navigate('ProfileEdit');
}
render() {
return (
<View>
<Button
onPress={() => this.toProfileEdit()}
title="Learn More" />
</View>
)
}
}
ProfileEdit.js
export default class ProfileEdit extends Component {
backTo() {
this.props.navigation.navigate('Profile');
}
render() {
return (
<View>
<Button
onPress={() => this.backTo()}
title="Learn More" />
</View>
)
}
}
Please anyone help me to solve this problem.
Thanks.
javascript reactjs react-native
asked Nov 13 '18 at 5:05
Frank AndrewFrank Andrew
388
I get a problem to get new data in parent component (Profile) after update data in child component (ProfileEdit), here I create a simple script in order easy to understand, default component is Profile, why cannot show alert in Profile after back from ProfileEdit, please give advices or correct my script how to show alert after back from ProfileEdit.
Profile.js
export default class Profile extends Component {
componentDidMount() {
alert('Success');
}
toProfileEdit() {
this.props.navigation.navigate('ProfileEdit');
}
render() {
return (
<View>
<Button
onPress={() => this.toProfileEdit()}
title="Learn More" />
</View>
)
}
}
ProfileEdit.js
export default class ProfileEdit extends Component {
backTo() {
this.props.navigation.navigate('Profile');
}
render() {
return (
<View>
<Button
onPress={() => this.backTo()}
title="Learn More" />
</View>
)
}
}
Please anyone help me to solve this problem.
Thanks.
javascript reactjs react-native
javascript reactjs react-native
asked Nov 13 '18 at 5:05
Frank AndrewFrank Andrew
388
asked Nov 13 '18 at 5:05
Frank AndrewFrank Andrew
388
asked Nov 13 '18 at 5:05
Frank AndrewFrank Andrew
388
asked Nov 13 '18 at 5:05
Frank AndrewFrank Andrew
388
asked Nov 13 '18 at 5:05
Frank AndrewFrank Andrew
388
388
you need to do this stackoverflow.com/a/52732960/7462666
– Haider Ali
Nov 13 '18 at 6:19
Possible duplicate of react-native save button status after changing screens
– gparyani
Nov 13 '18 at 6:28
add a comment |
you need to do this stackoverflow.com/a/52732960/7462666
– Haider Ali
Nov 13 '18 at 6:19
Possible duplicate of react-native save button status after changing screens
– gparyani
Nov 13 '18 at 6:28
you need to do this stackoverflow.com/a/52732960/7462666
– Haider Ali
Nov 13 '18 at 6:19
you need to do this stackoverflow.com/a/52732960/7462666
– Haider Ali
Nov 13 '18 at 6:19
Possible duplicate of react-native save button status after changing screens
– gparyani
Nov 13 '18 at 6:28
Possible duplicate of react-native save button status after changing screens
– gparyani
Nov 13 '18 at 6:28
add a comment |
1 Answer
1
active
oldest
votes
Profile already mount then componentWillMount will not call again on the back action. You can pass the function with prop action.
export default class ProfileEdit extends Component {
backTo() {
this.props.navigation.navigate('Profile');
}
render() {
return (
<View>
<Button
onPress={() => { this.props.something(); this.backTo()}}
title="Learn More" />
</View>
)
}
}
Pass function which name is something, call it after you can go back.
answered Nov 16 '18 at 12:59
Ayberk Anıl AtsızAyberk Anıl Atsız
25115
add a comment |
Your Answer
StackExchange.ifUsing("editor", function () {
StackExchange.using("externalEditor", function () {
StackExchange.using("snippets", function () {
StackExchange.snippets.init();
});
});
}, "code-snippets");
StackExchange.ready(function() {
var channelOptions = {
tags: "".split(" "),
id: "1"
};
initTagRenderer("".split(" "), "".split(" "), channelOptions);
StackExchange.using("externalEditor", function() {
// Have to fire editor after snippets, if snippets enabled
if (StackExchange.settings.snippets.snippetsEnabled) {
StackExchange.using("snippets", function() {
createEditor();
});
}
else {
createEditor();
}
});
function createEditor() {
StackExchange.prepareEditor({
heartbeatType: 'answer',
autoActivateHeartbeat: false,
convertImagesToLinks: true,
noModals: true,
showLowRepImageUploadWarning: true,
reputationToPostImages: 10,
bindNavPrevention: true,
postfix: "",
imageUploader: {
brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
allowUrls: true
},
onDemand: true,
discardSelector: ".discard-answer"
,immediatelyShowMarkdownHelp:true
});
}
});
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53274152%2fhow-to-re-render-parent-component-react-native-after-update-edit-in-child-compon%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
1 Answer
1
active
oldest
votes
1 Answer
1
active
oldest
votes
active
oldest
votes
active
oldest
votes
Profile already mount then componentWillMount will not call again on the back action. You can pass the function with prop action.
export default class ProfileEdit extends Component {
backTo() {
this.props.navigation.navigate('Profile');
}
render() {
return (
<View>
<Button
onPress={() => { this.props.something(); this.backTo()}}
title="Learn More" />
</View>
)
}
}
Pass function which name is something, call it after you can go back.
answered Nov 16 '18 at 12:59
Ayberk Anıl AtsızAyberk Anıl Atsız
25115
add a comment |
Profile already mount then componentWillMount will not call again on the back action. You can pass the function with prop action.
export default class ProfileEdit extends Component {
backTo() {
this.props.navigation.navigate('Profile');
}
render() {
return (
<View>
<Button
onPress={() => { this.props.something(); this.backTo()}}
title="Learn More" />
</View>
)
}
}
Pass function which name is something, call it after you can go back.
answered Nov 16 '18 at 12:59
Ayberk Anıl AtsızAyberk Anıl Atsız
25115
add a comment |
Profile already mount then componentWillMount will not call again on the back action. You can pass the function with prop action.
export default class ProfileEdit extends Component {
backTo() {
this.props.navigation.navigate('Profile');
}
render() {
return (
<View>
<Button
onPress={() => { this.props.something(); this.backTo()}}
title="Learn More" />
</View>
)
}
}
Pass function which name is something, call it after you can go back.
answered Nov 16 '18 at 12:59
Ayberk Anıl AtsızAyberk Anıl Atsız
25115
Profile already mount then componentWillMount will not call again on the back action. You can pass the function with prop action.
export default class ProfileEdit extends Component {
backTo() {
this.props.navigation.navigate('Profile');
}
render() {
return (
<View>
<Button
onPress={() => { this.props.something(); this.backTo()}}
title="Learn More" />
</View>
)
}
}
Pass function which name is something, call it after you can go back.
answered Nov 16 '18 at 12:59
Ayberk Anıl AtsızAyberk Anıl Atsız
25115
answered Nov 16 '18 at 12:59
Ayberk Anıl AtsızAyberk Anıl Atsız
25115
answered Nov 16 '18 at 12:59
Ayberk Anıl AtsızAyberk Anıl Atsız
25115
answered Nov 16 '18 at 12:59
Ayberk Anıl AtsızAyberk Anıl Atsız
25115
25115
add a comment |
add a comment |
Thanks for contributing an answer to Stack Overflow!
- Please be sure to answer the question. Provide details and share your research!
But avoid …
- Asking for help, clarification, or responding to other answers.
- Making statements based on opinion; back them up with references or personal experience.
To learn more, see our tips on writing great answers.
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53274152%2fhow-to-re-render-parent-component-react-native-after-update-edit-in-child-compon%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
you need to do this stackoverflow.com/a/52732960/7462666
– Haider Ali
Nov 13 '18 at 6:19
Possible duplicate of react-native save button status after changing screens
– gparyani
Nov 13 '18 at 6:28