React Router 4-处理404的嵌套路由

Question

我有以下代码，当输入错误的代码时，我将处理嵌套的路由：

<Switch>
<Route path="/" exact component={Home} />
<Route path="/sample" exact component={Sample} />
<Route path="/sample/example/:id" exact component={Example} />
<Route path="/sample/:example" exact component={Example} />
<Route component={404}/>
</Switch>

如果用户输入localhost:3000/something-wrong，它将正确显示404页。但是，当他输入localhost:3000/sample/something-wrong时，什么也不会呈现！ 我应该如何以某种方式处理此问题？

Answer 1

localhost:3000/sample/something-wrong由path="/sample/:example"

处理

localhost:3000/sample/example/something-wrong将由path="/sample/example/:id"

处理

使用通配符时，除了启用Example组件以呈现适当的消息，或者重定向到专用404屏幕外，您实际上无能为力。