Question

我正在重做我的应用中的一些路径，因此需要使用Redirect保留旧路径。我想更改这些路径：

以前的路径/bar现在重定向到/foo/bar。
以前的路径/bar/fizz现在重定向到/foo/bar/fizz。

根据路径语法docs（https://github.com/ReactTraining/react-router/blob/master/docs/guides/RouteMatching.md#path-syntax），我认为这应该是正常的：

<Route path="/" component={...}>
    <Route path="foo" component={...}>
        <Route path="bar" component={...}>
            <Route path="fizz" component={...}/>
        </Route>
    </Route>
    <Redirect from="bar(/*)" to="foo/bar(/*)"/>
</Route>
<Redirect path="*" to="/"/>

但是，这只会使第一个所需的重定向工作从/bar升级到/foo/bar。尝试转到/bar/fizz会将我重定向到根/。

如果我将Redirect更改为<Redirect from="bar/*" to="foo/bar/*"/>，那么情况恰恰相反;只有第二个所需的重定向才有效，从/bar/fizz到/foo/bar/fizz。尝试转到/bar会将我重定向到根/。

我使用它的唯一方法是包含两个Redirect来涵盖这两种情况。有一个更简洁的方法来写这个只有一个Redirect？：

<Route path="/" component={...}>
    <Route path="foo" component={...}>
        <Route path="bar" component={...}>
            <Route path="fizz" component={...}/>
        </Route>
    </Route>
    <Redirect from="bar" to="foo/bar"/>
    <Redirect from="bar/*" to="foo/bar/*"/>
</Route>
<Redirect path="*" to="/"/>

React-Router重定向路径语法，用于路径本身和路径以及后面的任何内容

0 个答案: