// I am using below code for navigating one screen to another i.e Home page . But when am navigating home page , I have to refresh the page ..reload . In current , when i am coming to home screen non of the life cycle method is getting call . Specially UserAvatar component I have to refresh ,or recall . Please suggest
<View style={{textTransform: 'lowercase'}}><YellowBtn label="Go to
Dashboard"
OnClick={this._redirectCustomerView}/></View>
_redirectCustomerView = () => {
this.props.navigation.navigate('UserHome');
};
// Below is home page
export default class App extends React.Component {
constructor(props) {
super(props);
this.state = { title: 'Hello!', hasFooterPermission: false };
console.log("Valuueeeeeee");
}
async componentDidMount() {
const homeFooter = await hasPermission('clm.360D.fe.restrictedView.allowed');
this.setState({
hasFooterPermission: homeFooter
})
}
onSearchClick = () => {
this.props.navigation.navigate('SubscriberSearch');
};
componentWillMount(){
console.log(" Home page dataaaa");
}
render() {
return (
<View>
<ImageBackground source={BG} style={{ width: '100%', height: '100%' }} resizeMode="cover">
<View style={{ paddingTop: 5 , alignContent:'space-between',flexDirection:'row'}}>
<View style={{alignSelf: 'flex-start', flex:1}}>
<UserAvatar navigationProps={this.props.navigation} avatarSize={40} isTouchable={true}/>
</View>
{/* <View style={{alignSelf: 'flex-end'}}>
<Icon
name="bell-outline"
type="MaterialCommunityIcons"
style={{ color: '#FFFFFF' }}
onPress={() => Toastr.showToast('No new notifications!', 3000)}
/>
</View> */}
</View>
If set to true, the browser will do a complete page refresh from the server and not from the cached version of the page. import React from 'react'; function App() { function refreshPage() { window. location. reload(false); } return ( <div> <button onClick={refreshPage}>Click to reload!
React Native provides an individual RefreshControl component specifically to implement pull-to-refresh easily in a React Native app. If you're rendering a list of data using the ScrollView or FlatList component, you can use RefreshControl to add the pull-to-refresh capability.
or the button click event <INPUT TYPE="button" onClick="history.go(0)" VALUE="next page"> when you use this, you refresh your page first and then go to next page, when you return back it will be having the last refreshed state.
Be decides to go back to the previous page and clicks the back button in browser. And when he is back, he sees the changes on the page as the browser showed the page (probably some browser cahing) before he triggerd the ajax (on/off classes) – John Doeherskij
The above will work 100% when back or forward button has been clicked using ajax as well. if it doesn't, there must be a misconfiguration in a different part of the script. For example it might not reload if something like one of the example in the previous post is used window.history.pushState('', null, './');
That means you'll have to listen for changes in the activated route and a page reload isn't required at all.
use push instead of navigate
this.props.navigation.push('UserHome');
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With