Reactjs 为什么在组件更新时不重新加载路由器路由属性渲染重新装载？

我的主要意图是重写Switch组件，然后通过显示实现组件的缓存，而不是每次都破坏它

//应用程序
常量应用=（）=>{
返回(
)
}

//MySwitch
常量cacheRouteMap={}
const MySwitch=props=>{
返回(
{
const location=props.location | | context.location
let元素
让比赛
让当前匹配路径
React.Children.forEach（props.Children，child=>{
//eslint禁用下一行无eq null
if（match==null&&React.isValidElement（子项））{
元素=子元素
const path=child.props.path | | child.props.from
currentMatchPath=路径
match=path？matchPath（location.pathname，{…child.props，path}）：context.match
}
})
如果（！cacheRouteMap[currentMatchPath]）{
cacheRouteMap[currentMatchPath]=React.cloneElement（元素{
位置，
计算匹配：匹配，
})
}
返回Object.values（cacheRouteMap）.map（d=>{
常量{path}=d.props
返回{d}
})
}
} 
/>
)
}

上面的代码可以运行，但如果上层重新渲染，MySwitch中的Route components render方法将重新装载

下面是我每次重新装载渲染方法的测试

反应路由器：5.2.0 react路由器dom:5.2.0

代码：

import React，{useState，useffect}来自“React”
从“react Router dom”导入{HashRouter as Router，Route，Switch，Redirect}
常量演示=（）=>{
useffect（（）=>{
console.log（'Demo确实挂载了……。）
}, [])
返回1111
}
常量应用=（）=>{
const[visible，setVisible]=useState（false）
返回(
setVisible（！visible）}>按钮
xxxxx
} />
)
}

---

当应用程序重新加载时，演示是重新装载而不是重新加载。我应该如何使用渲染功能重新渲染演示？谢谢 您只需直接挂载

<Route path="/" exact>
    <Demo />
</Route>

---

您是否尝试过使用此功能

当您使用

render={（）=>}

时，基本上是在使用

匿名

函数，该函数正在创建

演示

组件的新

实例

使用这种方法，您可以传递自己的自定义参数，也可以使用

react router

提供的钩子，如

useLocation

样本使用

<Route exact path="/">
  <App someProp={1} />
</Route>


function App(props) {
  let location = useLocation();

  return (
    <div className="App">
      <h1>Hello CodeSandbox</h1>
      <h2>Start editing to see some magic happen!</h2>
      <h2>Value of someProp is {props.someProp} </h2>
      <h2>Pathname is {location.pathname}</h2>
    </div>
  );
}

对于工作样本。
是的，这也可以，但您不能以这种方式安装多个组件。您好。OP的问题只是关于重新安装和重新渲染。这不是我想要的，我使用渲染方法并想要获得RouterContext道具。@cailongli，你可以在
演示组件中使用
useLocation
useParams
提供的
react router
钩子。这就是你想要的吗？@Nisarthreddy我也想要从上层传递道具。所以我放弃了组件方法，而是使用了渲染。但是渲染方法在每次更新路线时都会重新装载。这只是装载一次，但我无法获得RouterContext道具。我想要装载一次并获得位置或匹配道具。什么时候路由器改变了，不是重新装载而是渲染器。我想装载一次并获得位置或匹配道具。当路由器改变时，不是重新装载而是渲染器