/Javascript/Next.js/Get cuurent route name nextjs

Get cuurent route name nextjs

import React from 'react'
import Link from 'next/link'
import { useRouter } from 'next/router'

const menu = [
  { title: 'Home', path: '/home' },
  { title: 'Explore', path: '/explore' },
  { title: 'Notifications', path: '/notifications' },
]

const Sidebar = () => {
  const router = useRouter()

  return (
    <div>
      {menu.map((item, index) => {
        return (
          <Link key={index} href={item.path}>
            <a
              className={`cursor-pointer ${
                router.pathname === item.path
                  ? 'text-blue-500'
                  : 'hover:bg-gray-900 hover:text-blue-500'
              }`}
            >
              {item.title}
            </a>
          </Link>
        )
      })}
    </div>
  )
}

export default Sidebar

Source: flaviocopes.com

Similar codes

0 vote141 views1 answer
Next js redirect if not logged in
Javascript Next.js
0 vote152 views1 answer
Next js find all the rerenders
Javascript Next.js
0 vote153 views1 answer
Next js get request
Javascript Next.js
0 vote145 views1 answer
How to update the react version in next js app
Javascript Next.js
0 vote141 views1 answer
How to install jsonwebtoken in next js
Javascript Next.js
23 votes245 views2 answers
Add favicon to next js static site
Javascript Next.js
11 votes253 views5 answers
Next js create app
Javascript Next.js
0 vote159 views1 answer
Tailwindcsss next js change font
Javascript Next.js
0 vote146 views1 answer
How to create a nextjs app from a template
Javascript Next.js
0 vote108 views2 answers
Mdb nextjs
Javascript Next.js