需要声明一个包含字符串和参数的可选路径 现在我有了这个路径
<Route exact path="/tasks/:id" render={(props) => ( <AsyncTask {...props} profile={this.state.profile} /> )} />
我需要
/tasks/:id/notification/:notificationId
在哪里notification/:notificationId是可选的, 我试图以这种方式添加它,但它不起作用
notification/:notificationId
/tasks/:id/(notification/:notificationId)?
我需要知道我是否来自通知链接,并将其标记为已读。
这工作
/tasks/:id/(notification)?/:notificationId?
但是它匹配并且没有路径 notificationId
notificationId
可悲的是似乎没有办法做到这一点。理想的方法是为您的目的创建两个单独的路线。
<Route exact path="/tasks/:id" component={...} /> <Route exact path="/tasks/:id/notification/:notificationId" component={...} />
如果 确实 只需要声明一个Route,则可以使用自定义的regex规则(在参数名称声明后的括号中包裹的部分):
<Route exact path="/tasks/:id/:notificationId(notification/\d+)?" component={...} />
然而!! -请注意,该notificationId参数将包含substring "notification"。例如,如果您有:
"notification"
tasks/123/notification/456
您将有一个taskIdof "123"和notificationIdof "notification/456"(整个字符串)!
taskId
"123"
"notification/456"
也就是说,上述路线将与以下路径匹配:
tasks/123
但不是:
tasks/123/notification
tasks/123/notification/abc
tasks/123/456
等等…
TL; DR- 您可能想要使用两条单独的路线,如上面的第一个示例所示。