React router 嵌套的反应路由导致父级重新装载

我使用的是react路由器5.2，有嵌套路由。我的子组件（下面）有一个菜单，当我单击时，它会将我的页面更改为嵌套路由（我使用useHistory钩子进行导航）。但是，这似乎会产生重新安装我的子组件的效果，从而丢失该子组件中的状态（useState）

是否有更正确的方法来执行此操作，以便在useHistory将我带到其嵌套路由之一时不会重新装载子组件

非常感谢

const App = (props) => {
   useEffect(()=>{console.log('App mounted')},[])
   return (
      <Switch>
         <Route component={Child} />
         <Route .../>
         <Route .../>
      </Switch>
   )
}

const Child = (props) => {
   useEffect(()=>{console.log('Child mounted')},[])
   return (
      <Menu />
      <Switch>
         <Route component={Grandchild} />
         <Route .../>
         <Route .../>
      </Switch>
   )
}

const Grandchild = (props) => {
   useEffect(()=>{console.log('Child mounted')},[])
   return <div>Hello</div>
}

const-App=（道具）=>{
useEffect（（）=>{console.log（'App-mounted'）}，[]
返回(
)
}
const Child=（道具）=>{
useffect（（）=>{console.log（'Child-mounted'）}，[]
返回(
)
}
常量孙子=（道具）=>{
useffect（（）=>{console.log（'Child-mounted'）}，[]
打招呼
}