首页 > 解决方案 > 对于多个可选参数,React 路由器在 // 之后忽略 URL

问题描述

我想将此 url https://localhost:8050/search/Contact// * 匹配到下面给出的路径。

    <Route path="/search/:type?/:subType?/:query?" component={TestComponent}?> 

由于子类型是可选参数,所以我改为传递空白。但是“查询”参数被一起忽略了。

我在道具中得到如下匹配

match {
    params: {type: "Contact", subType: undefined, query: undefined}
    path: "/search/:type?/:subType?/:query?"
    url: "/search/Contact"
}

我希望 * 与匹配参数中的查询进行映射

标签: react-router-v4

解决方案


如果您不使用 :subType 则将其删除或使用 2 条不同的路线。

<Route exact path="/search/:type?/:query?" component={TestComponent}?> 
<Route path="/search/:type?/:subType?/:query?" component={TestComponent}?> 

推荐阅读