react refresh page – React refresh or reload page Example: how to refresh the page using react window.location.reload(false);
react refresh page To refresh a page, we need to use the window.location.reload() method in React. In this article, I’m going to share how to reload a component and page in React.js
window.location.reload(false);
/src/Reload.js
import React from 'react'
class Reload extends React.Component{
function storeProductData() {
window.location.reload(false);
}
render(){
return(
<div>
<button onClick={storeProductData}>Click to reload!</button>
</div>
)
}
}
export default Reload;
ShoppingCart.js
import React, { useState } from 'react';
function ShoppingCart() {
const [cart, setCart] = useState([]);
function storeProductData(e) {
const item = e.target.value;
console.log(item);
setCart(cart => [...cart, item]);
}
return (
<div className="app">
<div className="items">
<button value="Laptop Pro" onClick={storeProductData}>???? Laptop Pro</button>
<button value="iPhone XS" onClick={storeProductData}>????iPhone XS</button>
<button value="Computer" onClick={storeProductData}>???? Computer</button>
<button value="DVD Bear" onClick={storeProductData}>???? DVD Bear</button>
</div>
<div className="cart">
????Cart
<ul>
{cart.map(item => <li key={item}>{item}</li>)}
</ul>
</div>
</div>
);
}
export default ShoppingCart;
I hope you get an idea about react refresh page.