Question

我正在关注reacttraining.com的基本示例

到目前为止，所有内容都在“无匹配”页面上工作。

如果我使用他们显示的完全相同的代码：

<Switch>
    <Route path="/" exact component={Home}/>
    <Redirect from="/old-match" to="/will-match"/>
    <Route path="/will-match" component={WillMatch}/>
    <Route component={NoMatch}/>
 </Switch

只有当url与任何其他组件不匹配时，NoMatch组件才会呈现。

相反，它会在每个网址上呈现，包括具有组件的网址。

他们说

没有路径的A始终匹配

但该规则不应仅适用于无组件网址吗？

我做错了什么？

此外，在同一主题上：如何渲染路径的整个页面，而不仅仅在同一页面上渲染组件？

谢谢！

Answer 1

据我从您的代码中了解，您有3条路线：

1）\作为项目的根源

2）old-match您要重定向到匹配的对象

3）will-match想要显示WillMatch组件

，并且未知路由必须呈现NoMatch组件。为此，最好采用上述方法来处理路由以处理重定向和404组件：

<Switch>
    <Route path="/" exact component={Home} />
    <Route exact={true} path='/old-match' render={() => { return <Redirect to="/will-match" />; }} />
    <Route path="/will-match" component={WillMatch} />
    <Route component={NoMatch} />
</Switch>

每个网址上的404页面呈现[使用React-router]

1 个答案: