user image

Joseph Morgan
Published in : 2022-02-08

Reload browser window using Reactjs?

React js

Hello everyone,
Please How can I refresh the page (reload the window) using Reactjs?

Thanks in advanced

Comments

Mohamed Atef Date : 2022-02-08

Best answers

46

Best answers

46

You can do it using a button or any function like 

<Button size="medium" variant="text" onClick={ () => { window.location.reload(); } } startIcon={<ArrowBackIosIcon /> }>
      Start from beginning
</Button> 
import React from 'react';
import Page from 'src/components/Page';
import { 
    Grid,
    withStyles 
} from '@material-ui/core';
import { withSnackbar } from 'notistack';
import { withRouter } from 'react-router-dom';
import ArrowBackIosIcon from '@material-ui/icons/ArrowBackIos';

const styles = (theme) => ({
    root:{
        paddingTop: '31px',
        minHeight: '90vh',
    }
});

class Quiz extends React.Component {

    render(){
        return(
            <Page title="Reload page">
                <Container maxWidth="lg">
                    <Grid container>
                        <Grid item md={2} xs={12}/>
                            <Grid item md={3} xs={12}></Grid>
                            <Grid item md={6} xs={12}>
                                <Box display="flex" pb={5}>
                                    <Button size="medium" variant="text" onClick={ 
                                    () => { 
                                    	this.props.history.push('/search-by-goal/'); 
                                    	window.location.reload(); 
                                    } } startIcon={<ArrowBackIosIcon /> }>
                                        Start from beginning
                                    </Button> 
                                </Box>
                            </Grid>
                        <Grid item md={2} xs={12}/>
                    </Grid>
                </Container>
            </Page>
        );
    }
}
export default withSnackbar(withStyles(styles)(withRouter(Quiz)));

Thats all 

Joseph Morgan Date : 2022-02-08

Great, Thanks

Mohammed Bal'awi Date : 2022-02-09

Best answers

1

Best answers

1

You can use :

window.location.reload()

This will reload the page from the cache

If you want to reload from server just use :

window.location.reload(true)

Hope this helpful.

 

Jo Micheal Date : 2022-02-09

That's it, Thank you for clarification 

Leave a comment

Join us

Join our community and get the chance to solve your code issues & share your opinion with us

Sign up Now

Related posts

React Component displaying a list of lines
Publish date: 2022-03-19 | Comments: 3

Tag: React js

React usestate array map() is not working
Publish date: 2022-04-22 | Comments: 3

Tag: React js

How to use SetFieldValue from outside render function? Formik
Publish date: 2021-07-03 | Comments: 2

Tag: React js

[solved] Expected a conditional expression and instead saw an assignment
Publish date: 2021-11-29 | Comments: 0

Tag: React js

useStyles Invalid hook call class component
Publish date: 2022-02-10 | Comments: 2

Tag: React js

React Redux : Connect is not called
Publish date: 2022-03-02 | Comments: 1

Tag: React js

Module not found: Can't resolve 'swiper' in Reactjs [Solved]
Publish date: 2021-10-03 | Comments: 1

Tag: React js