Navigasi

Lo udah belajar bikin route, sekarang lo perlu tau cara navigasi di antara route tersebut. Sama kayak di Next.js, React Router juga punya component <Link>. Bedanya, alih-alih pake href, lo pake to buat ngasih tahu path yang mau dituju.

Contohnya gini:

Selain <Link>, lo juga bisa pake component <NavLink>. Component tersebut mirip kayak <Link>, cuman dia punya fitur tambahan kayak buat nentuin apakah link tersebut aktif atau nggak. Ini berguna buat styling link yang aktif, contohnya:

Kalo mau navigasi programatis, lo bisa pake hook useNavigate. Hook ini mirip kayak useRouter di Next.js, tapi lebih simpel. Lo bisa pake navigate buat pindah ke route lain.

Kalo navigasi yang butuh interaksi user, lo bisa pake <Link> atau <NavLink>. Tapi, kalo navigasi yang butuh logika atau kondisi tertentu, lo bisa pake useNavigate.