Firstly from Login.js you are not using Link from 'react-router-dom'
import Link from '@material-ui/core/Link';
You are using Link from material ui and material ui uses href to route from page A to page B not the to keyword that is used by react-router-dom
Since you are using forms from Material Ui you can still change the Link and use the react-router-dom Link
Your code should be like this:
Login.js
import {Link} from 'react-router-dom';
//Now with link coming from react-router you can use **to**
<Link to="/register" variant = "body2">
Not have an account ? Sign up here
</Link>
- So that same logic will apply when you want to route to page on certain events you want to import link the way I showed above
Now on the app level you have to Wrap it with Router
import Register from './Components/register';
import Login from './Components/login';
import {
BrowserRouter as Router,
Switch,
Route,
Link
} from "react-router-dom";
function App() {
return (
<Router>
<Switch>
<Route exact path = "/"><Login/></Route>
<Route path = "/register"><Register/></Route>
</Switch>
</Router>
);
}
export default App;
CLICK HERE to find out more related problems solutions.