如何匹配url中的可选参数？ [复制]

Posted 2023-02-21

技术标签:

【中文标题】如何匹配url中的可选参数？ [复制]【英文标题】：How to match optional parameter in url? [duplicate] 【发布时间】：2020-10-10 15:40:05 【问题描述】：

是否可以为 url 使用可选参数？例如路径fruits/:id如果不传递参数id将匹配同一个组件；

<Route path="/fruits/:id">
  <Fruits />
</Route>

目前要实现它，我需要声明两条路由fruits:/id 和/fruites/ 来匹配同一个组件。

<Route path="/fruits/:id">
  <Fruits />
</Route>

<Route path="/fruits/">
  <Fruits />
</Route>

【问题讨论】：

【参考方案1】：

您正在使用 react-router，因此您不必担心它。 React 路由器将使用此代码匹配 /fruits 和 /fruits/1。

<Route path="/fruits/:id">
  <Fruits />
</Route>

【讨论】：

【参考方案2】：

像这样定义路由

<Route path="/fruits/:id?">

这对 /fruits 和 /fruits/1 都有效

【讨论】：

以上是关于如何匹配url中的可选参数？ [复制]的主要内容，如果未能解决你的问题，请参考以下文章