我有这样的网址；
http://0.0.0.0/country/bosnia-and-herzegovina-644
这是我的路线声明
<Route path="/country/:countrySlug-:countryId" component={CountryPage} />
所以这在连字符打破时不起作用，我该如何更改它，所以我只提取最后一个连字符作为参数，我真的不想更改我的 slug 生成系统以使用不同的字符，因为这些是最易读的恕我直言，但仅用于信息，不用于内容加载。
谢谢
在react-router中匹配带连字符的路由
IT技术
javascript
reactjs
react-router
2021-05-06 16:35:14
2个回答
我不知道你是否可以这样做，但也许你可以这样做：
<Route path="/country/:country" component={CountryPage} />
然后在组件中：
const countryId = this.props.match.params.country.slice('-').pop();
您不能将连字符-用于参数分隔和单词分隔。
您可以使用连字符-分隔参数，下划线_表示countrySlug单词之间的空格。
这里你的 URL 看起来像
http://0.0.0.0/country/bosnia_and_herzegovina-644
现在使用这个 Route 声明
<Route path="/country/:countrySlug-:countryId" component={CountryPage} />
当您生成链接时，不要忘记用_符号替换空格，否则您的 URL 将如下所示。
http://0.0.0.0/country/bosnia%20and%20herzegovina-644
但是，它仍然可以正常工作。
其它你可能感兴趣的问题