使用可选参数来反应路由器路由冲突

时间:2018-08-30 22:35:25

标签: javascript reactjs ecmascript-6

我无法访问dashboard/job/123/status,我猜它有冲突吗?

<Route
  exact
  path="/dashboard/job/:jobId/:notificationId?"
  component={Jobs}
/>
<Route exact path="/dashboard/job/:jobId/status" component={JobStatusContainer} />

1 个答案:

答案 0 :(得分:0)

正如凯尔(Kyle)所述,您需要颠倒路线的顺序。

<Route exact path="/dashboard/job/:jobId/status" component={JobStatusContainer} />
<Route
  exact
  path="/dashboard/job/:jobId/:notificationId?"
  component={Jobs}
/>

您拥有的订单dashboard/job/123/status/dashboard/job/:jobId/:notificationId?路径占用,并且从未到达/dashboard/job/:jobId/status路径的支票,因为它认为您希望status:notificationId

的值