React Router V3 - 嵌套路由组件在路径参数更改时卸载

Question

我刚刚注意到，在 react 路由器 (v3.x) 中，如果路径参数发生更改，组件会卸载并重新安装。这是预期的行为吗？

路线：

<Route path="/landing/register/:step" component={Register}/>

现在，假设我在路线 "/landing/register/personal-data" 上，我正在通过 <Link/> 或 router.push({...}) 导航到下一个注册步骤 "/landing/register/address"，Register 组件首先被卸载，然后再次安装，失去了它的所有状态。

这是正确的方法还是我做错了什么？

编辑：

似乎问题在于我使用的是嵌套路由，其中​​我使用了一个组件作为父路由。

此示例有效（在路径参数更改时不重新安装 Register-Comp）：

<Route path="/landing">
   <Route path="register/:step" component={Register}></Route>
</Route>

但是当我为父路由使用组件时，它不会（不是重新安装 AppView-Comp，而是在路径参数更改时注册-Comp）：

<Route path="/landing" component={AppView}>
   <Route path="register/:step" component={Register}></Route>
</Route>

Answer 1

我通过在子组件中嵌套路由来解决这个问题，如下所示：

// Router class
 <Route path="/landing/register" component={Register}/>


 //Register component

 <BrowserRouter>
  <div> 
   <Route path="/landing/register/personal-data" component={PersonalData}/>
   <Route path="/landing/register/payment-data" component={PaymentData}/>
   ...other routes
  </div>
 </BrowserRouter>

但是在这种情况下，我将用户数据存储在 redux 存储中而不是组件状态中，但是您可以将其存储在组件状态中，这没有问题。