Joseph Morgan

30 Sep 2021

import link as router link from 'react-router-dom' Reactjs

React js

Is there is any way to make the Link Component from the Material UI works with Router, I am using this line to import it from the react router but it's not working for me

import link as router link from 'react-router-dom';

What i need to do is adding this text with links to the Component 

<Typography variant="body2" align="center">
 <Link href="/login">Sign-in</Link><Link href="/signup"> or sign-up to see the list</Link>

Thanks in advance


Mohamed Atef

30 Sep 2021

Best Answer

best answer

Hi Joseph it's possible to make the Link Component support the react router but you missed something,

import { Link as RouterLink } from 'react-router-dom';
import {
} from '@material-ui/core';

then to the Link Component should be like this code below

<Typography variant="body2" align="center">
 <Link component={RouterLink} to="/login">Sign-in</Link><Link component={RouterLink} to="/signup"> or sign-up to see the list</Link>

just add component attribute and the value of this attr is the name of the imported class from the react-router-dom then use to="/route" instead of href

Good LUCK!

Michaela Lattenbergova

31 Jan 2022


I was wondering how would this work with react-router-v6 ? I am currently upgrading my app from v5.1 to v6, using Link from @material-ui/core but clicking on the link in my app does not redirect to a new path.


Mohamed Atef

31 Jan 2022


It should be the same, Can you check the console of the browser please ?

© 2024 Copyrights reserved for