如何使用 React-Router V4 转义路径内的颜色字符 (:)?

IT技术 reactjs react-router-v4
2021-05-20 06:17:55

我有一个看起来像这样的网址:

/foo/bar/main:home
/foo/bar/main:about_us
/foo/bar/main:contact_us

如您所见,我在 url 中:,需要考虑到这一点。我想要的是将组件Home匹配/foo/bar/main:home,但是/foo/bar/main:XXXXX匹配组件Default 的任何其他路径

到目前为止我尝试过的:

<Route path={'/foo/bar/main:home'} component={Home} />
<Route path={'/foo/bar/main:any'} component={Default} />

这始终匹配 Home 组件。

<Route path={'/foo/bar/main%3Ahome'} component={Home} />
<Route path={'/foo/bar/main:any'} component={Default} />

现在,默认值一直匹配。任何帮助,将不胜感激。谢谢。

1个回答

react-router使用path-to-regexp. 所以为了逃避,:我认为这会奏效:

/foo/bar/main\\:contact_us