Missing "key" prop for element in iterator

JavaScript
1

I a new in next.js, i cannot upload my web to vercel and netlify because i get an error while upload it, can anyone help me please ?

import Link from "next/link";
import { withRouter } from "next/router";

function Navbar({  router }) {
const  navs = [
    { text: 'Home', href:'/'},
    { text: 'About', href:'/about'},
    { text: 'Portfolio', href:'/portfolio'},
    { text: 'Contact', href:'/contact'},
  ];
  return (
        <ul className="nav-links">
          {navs.map(nav => ( 
          <li><Link href={nav.href} className={`nav-item ${ router.pathname == nav.href ?  'active' : ''}`}>{nav.text}</Link></li> 
          ))}
        </ul>
      </div>
     </nav>
  );`
}

export default withRouter(Navbar);
2

Just a few questions:

  • What is that stray back tick doing at the end of the return?
  • Can you return just a closing </div> and </nav> tag?
3
1 Like
4

This topic was automatically closed 182 days after the last reply. New replies are no longer allowed.