
I used to useNavLink instead of abutton more often because I didn't know how to link that button to a specific URL while usingreact-router,useHistory hook provided byreact-router can be used with abutton.
import{useHistory}from'react-router-dom'consthistory=useHistory();consthandleLogin=()=>{history.push('/homepage')}<buttononClick={handleLogin}>Login</button>
NavLink should be used with some kind ofnavigation bar as it will be helpful in showing which tab is active and at the same time will be able to take to some other linked URL.
And also if the navigation bar is visible to the user while navigating to other pages thenNavLink is a better choice.
import{NavLink}from'react-router-dom'<NavLinkto='/home'style={{background:'green'}}activeStyle={{background:'red'}}>Home</NavLink><NavLinkto='/about'style={{background:'green'}}activeStyle={{background:'red'}}>About</NavLink><NavLinkto='/dashboard'style={{background:'green'}}activeStyle={{background:'red'}}>Dashboard</NavLink>
Link too should be used with some kind ofnavigation bar but it will not be helpful in showing which tab is active without some extracss effort but the sole purpose of linking it to some URL will be served.
And also if the navigation bar is not visible to the user while navigating to other pages thenLink is a better choice.
import{Link}from'react-router-dom'<Linkto='/home'style={{background:'green'}>Home</Link><Linkto='/about'style={{background:'green'}}>About</Link><Linkto='/dashboard'style={{background:'green'}}>Dashboard</Link>
Top comments(1)
For further actions, you may consider blocking this person and/orreporting abuse