Is there a way to redirect from one page to another in React and automatically scroll to a specific section when a button is clicked?
const navigatePage = () => {
if(window.location.pathname !== '/target-page'){
window.location.assign(TargetPageLink());
window.scrollTo({ top: document.getElementById('specific-section').offsetTop, behavior: 'smooth' });
}
}
<div onClick={navigatePage} className={classes.button} style={{display: showButton ? 'block' : 'none',}}>
...
</div>
The desired destination on the second page can be identified by an HTML element.
<div id="specific-section"></div>
I am currently facing the issue where the window scrolls first and then redirects to the other page. Is there a way to reverse this order or any alternative methods to achieve the same outcome?
I am open to suggestions and ideas that can help me achieve the desired functionality seamlessly.