Menu
I was working on react project. I was trying to reload a component when we click the reload button. I implemented the onClick function as given below. But it is reloading the whole window. I just want to reload only that class component, not the whole window. Can anyone help me to solve this?
refreshPage() {
window.location.reload();
}
676
React refresh or reload page example; In this tutorial, you will learn how to reload or refresh web page in react js apps wtih javascript window.location.reload () method. And as well as, learn how to refresh react component with hooks. To refresh a page, you need to use the javascript window.location.reload () in React apps.
To run the React app, execute the following command on your terminal: In this step, execute the following command to install react boostrap library into your react app: In this step, create PageComponent .js file. So, visit the src directory of your react js app and create a simple web page component file named PageComponent .js.
By using useState () react hook, we can reload a component too: MyComponent.js. import React, { useState } from 'react'; function MyComponent() { const [ value, setValue] = useState(); const refresh = ()=>{ setValue({}); } return ( <div> <button onClick={ refresh }>Refresh Component</button> </div> ); } export default MyComponent; Copy. That’s it.
As we know React JS is an open source JavaScript library that is used for building user interfaces specifically for single-page applications. It is also known for providing fast user experience by only updating the parts of the UI that have changed.
use React Hook:
useEffect(()=> {
fetchData();
}, [data]);
// page will reload whenever data is updated.
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
