Why MenuItem component not work as Link in react material-ui

Question

Hi I try to use popover menu which should after click on item change url and component but it not works. I built my situation in sandbox: https://codesandbox.io/s/romantic-surf-40p19?fontsize=14&hidenavigation=1&theme=dark

I am using it like this

<MenuItem component={Link} to="/edit">
   Zmena role
</MenuItem>

Problem is that after clicking nothing happend. Thx for help

Answer 1

your problem is that in JSX, css is written a bit differently from the regular CSS. your style background-color: red should be written as backgroundColor: "red" I have added a link to the working version I fixed below. Pay attention to how I wrote the css in the JSX.

Solution: https://codesandbox.io/s/romantic-golick-jhzcz

For extra studying: https://www.w3schools.com/react/react_css.asp , https://reactjs.org/docs/faq-styling.html

Let me know if this helped!