Empresas
Empregos
  • Sobre nós
  • Soluções
    • Publicação de vagas
      Publique sua vaga e receba candidatos qualificados em 48h.
    • Avaliações de candidatos
      Mais de 500 testes técnicos e psicológicos, mais anti-fraude.
    • Headhunting
      Busca executiva personalizada do início ao fim.
    • Folha de Pagamento + EOR
      Dispersão de folha e EOR em mais de 15 países da LATAM.
  • Preços
  • Empregos

0

193
Visualizações
how to render the correct component in routes NextJs

I have a problem when I change routes. Between pages it renders me fine. But when I need a dynamic route it does not render me. In routes I have the folder uw and inside [table].js

When I put the manual routes uw/first and I want to go to uw/second, the first one does render well and then the second one sticks to the style of the first one and it does not bring me the correct data for that view

 const menuItems = [
    {
        href: '/dashboard',
        title: 'Inicio',
        icon: 'fluent:home-16-filled',
    },
    {
        href: '/uw/primera' ,
        title: 'Cartera',
        icon: 'bxs:user',
    },
    {
        href: '/uw/segunda',
        title: 'Cartera',
        icon: 'bxs:user',
    },
];

and then return the routes

<div>
   <aside className="main-aside">
      <div className="main-aside-image">
         <Image 
            src="/logo-castor.png" 
            alt=""      
            width={198}
            height={32}/>
      </div>
      <nav>
         <ul className="main-aside-items">
            <div className="main-aside-categories">
               {menuItems.map(({ href, title, icon }) => (
               <li className="main-aside-item-categories" key={title}>
                  <Link href={href}>
                  <a
                  className={`flex p-2 bg-fuchsia-200 rounded hover:bg-fuchsia-400 cursor-pointer ${
                  router.asPath === href && 'bg-fuchsia-600 text-white'
                  }`}
                  >
                  {title}
                  </a>
                  </Link>
               </li>
               ))}
            </div>
         </ul>
      </nav>
   </aside>
</div>
about 4 years ago · Juan Pablo Isaza
1 Respostas
Responde à pergunta

0

You're using the title as the key inside the map, since the title is the same between uw/primera and uw/segunda it won't update the component.

Changing the key to the href could solve that.

<li className="main-aside-item-categories" key={title}>

to

<li className="main-aside-item-categories" key={href}>
about 4 years ago · Juan Pablo Isaza Relatório
Responde à pergunta
Encontrar trabalhos remotos

Descubra a nova forma de encontrar um emprego!

melhores empregos
Principais categorias de trabalho
Empresas
Postar vaga Preços Comercial
Jurídico
Termos e Condições Política de privacidade
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Recomende algumas ofertas para mim
Preciso de ajuda