react router only update url - react-router

Question

When I click the profile navigator the url change but the page doesn't. I try to move the router tag into index.js, using withRouter in my App.js and Profile.js but it's not work. I already use exact inside my url for homepage. This the code App.js
function App() {
return (
<Router>
<Switch>
<Route path="/" exact component={Home} />
<Route path="/profile" component={withRouter(ProfilePage)} />
</Switch>
</Router>
);
}
And this is Home.js
const home = () => {
return(
<Router>
<div className="container">
<img src={environment} alt="environment" className="environment"/>
<Link to="/email"><img src={pos} alt="pos" className="pos"/></Link>
<Link to="/profile" className="profile"><img src={profile} alt="profil"/></Link>
<Link to="/experiences"><img src={experience} alt="experience" className="experience"/></Link>
<Link to="/projects"><img src={project} alt="project" className="project"/></Link>
</div>
</Router>
);
}
Profile.js
const Profile = () => {
return(
<div className="profile-container">
<h2>Profile</h2>
<span className="line"></span>
<img src={photo} alt="photo-profile" className="photo-profile"/>
</div>
</div>
);
}

Answer 1

You should Update Home page and remove Router page:
const home = () => {
return(
<div className="container">
<img src={environment} alt="environment" className="environment"/>
<Link to="/email"><img src={pos} alt="pos" className="pos"/></Link>
<Link to="/profile" className="profile"><img src={profile} alt="profil"/></Link>
<Link to="/experiences"><img src={experience} alt="experience" className="experience"/></Link>
<Link to="/projects"><img src={project} alt="project" className="project"/></Link>
</div>
);
}
I think this the problem you try to call Router twice.