从 react-router v4 中具有路径参数的路由重定向

Question

我正在尝试从一个具有 ID 的 url 重定向到一个具有相同 ID 的新的：/folders/:id TO /folders/:id/summary

我的问题是我的容器 FolderSummaryContainer 似乎从未被调用过 :-/

这是我的 React 路由器配置 (v4)，我做的对吗？

{/* STUF */}
<Route path="/v3">
  <LayoutV3>
    <Switch>
      <Route exact path="/v3/folders" component={FolderIndexContainer} />
      <Route path="/v3/folders/:id">
        <FolderShowContainer>
          <Switch>
            <Redirect from="/v3/folders/:id" to="/v3/folders/:id/summary" />
            <Route path="/v3/folders/:id/summary" component={FolderSummaryContainer} />
            {/* STUF */}
          </Switch>
        </FolderShowContainer>
      </Route>
    </Switch>
  </LayoutV3>
</Route>
{/* STUF */}

Answer 1

不要为 Route 指定子项，而是您可以这样做

<Route path="/v3">
  <LayoutV3>
    <Switch>
      <Route exact path="/v3/folders" component={FolderIndexContainer} />
      <Route path="/v3/folders/:id" component={FolderShowContainer}/>
    </Switch>
  </LayoutV3>
</Route>

您可以在您的 FolderShowContainer Return 代码本身中设置路由配置然后 defiend

class FolderShowContainer extends React.Component {
     render() {
        return (
            <div>
             {/* */}
             <Switch>
                 <Redirect from="/v3/folders/:id" to="/v3/folders/:id/summary" />
                 <Route path="/v3/folders/:id/summary" component={FolderSummaryContainer} />
                 {/* STUF */}
             </Switch>
            </div>
         )
    }
}

从 react-router v4 中具有路径参数的路由重定向

Redirect from a route having path params in react-router v4

reactjs

react-router-redux

react-router-v4