From the course: Build Modern Web Apps with React, Hooks, State Management, and APIs Using Vite or Next.js

Unlock this course with a free trial

Join today to access over 25,200 courses taught by industry experts.

NavLink

NavLink

From the course: Build Modern Web Apps with React, Hooks, State Management, and APIs Using Vite or Next.js

Start my 1-month free trial Buy for my team

NavLink

“

Hello and welcome back. In this video, we are going to study about the nav link component and this nav link component works exactly the same as the link component. That means it does not let you refresh your page while routing but it has an additional feature which is an active link. This is related to the styling. So the nav link component is a special version of link that adds styling information to the rendered element. When its value is active, it means the URL matches to its props. This is usually great when you are creating a navigation menus where the current page link is highlighted that you want to tell the user what is the current page that the the user is on. It has a class name prop, so you can provide the styling of your choice. It can be a function that receives an isActive boolean. And by utilizing the isActive props, you can define the styling according to your need. That's an example to the nav link. So over here you can have a nav link and you can have a to prop…

Contents