React link to another page on drop down menu-CodePudding

I tried to link to another page on my responsive drop down menu but sadly it's not working. I am using MUI for the front end and React in the Backend. My code is on GitHub on Branch David.

CodePudding user response：

You have not attached the Link to the dropdown menu. If you want to switch pages on dropdown menu item click then please wrap the code of menu dropdown option render in Link i.e.,

import {Link} from "react-router-dom";
{pages.map((page) => (
 <Link to={page.link} key={page.name}> 
  <MenuItem  onClick={handleCloseNavMenu}>
      <Typography textAlign="center">
        {page.name}
      </Typography>
   </MenuItem>
  </Link>
))}

CodePudding user response：

You should use react-router and react-router-dom packages for this purpose. They provide APIs for routing and navigation.

I think this link is very helpful for you: Programmatically navigate using React router

Happy coding! :)