How to Refresh / Reload a Component and Page in React?

Today, We want to share with you react refresh page.In this post we will show you how to reload page automatically in react js?, hear for React route refresh without page reload we will give you demo and example for implement.In this post, we will learn about open link in new tab react with an example.

How to reload page in react js?

how to reload active page then you can display this demo. this first way to refresh component or page use javascript location reload method. in this demo We will display you reload active page onclick button. here refresh react component using reload method.

Read Also:  Form Validation Using React Examples

If you have any time simple How to refresh page on button click in react js after that follow this article. also refresh page after submit form. In react refresh page without reload using this example.

/src/loadRefreshContent.js

import React from 'react'

class loadRefreshContent extends React.Component{

    function loadRefreshContent() {
		window.location.reload(false);
	}

    render(){
        return(
        	<div>
		    	<button onClick={loadRefreshContent}>Click to reload!</button>
		    </div>    
        )  
    }
}

export default loadRefreshContent;

Refresh Component

Using this.setState() method, I am able to refresh a component only:

import React from "react";

class loadRefreshContent extends React.Component {

    refresh = () => {
      // re-renders the component
      this.setState({});
    };
  
    render() {
      return (
        <div>
          <button onClick={ this.refresh }>Refresh Component</button>
        </div>
      );
    }
  }
  
  export default loadRefreshContent;

By using useState() react hook, we can reload a component too:

import React, { useState } from 'react';

function loadRefreshContent() {

    const [value, setValue] = useState();

    const refresh = ()=>{
        // re-renders the component
        setValue({});
    }
  
    return (
      <div>
        <button onClick={ refresh }>Refresh Component</button>
      </div>
    );
  }
  
  export default loadRefreshContent;

I hope you get an idea about How to reload page automatically in react js?.
I would like to have feedback on my infinityknow.com blog.
Your valuable feedback, question, or comments about this article are always welcome.
If you enjoyed and liked this post, don’t forget to share.