在浏览器中更改 URL 的值，但不更改要呈现的 React 组件的值

Question

我有一个链接<Link to = "country/USA"/>

然后路线<Route path="country/:countryId" component={Country}/>

当呈现组件">国家/地区"时，浏览器 URL 是

http://<domain>/country/USA

有没有办法将浏览器 Url 的显示更改为http://<domain>/country，并且仅将">countryId"作为国家/地区组件中的路由道具。

经历过

https://reacttraining.com/react-router/web/api/BrowserRouter https://github.com/ReactTraining/react-router

找不到任何有用的东西。

有什么建议吗？

谢谢！

Answer 1

除非你同意USA成为查询字符串的一部分，否则你在 React Router 中无能为力(片段来自 react-training 站点(

<Link to={{
pathname: '/courses',
search: '?sort=name',
hash: '#the-hash',
state: { fromDashboard: true }
}}/>

另一种不涉及路由器的替代方法是拥有一个容器组件，该组件接收USA作为 props，然后以编程方式呈现所需的组件。我想说的是，对于在URL中显示的有意义的内容来说，工作量太大了

编辑

通过组件执行此操作的一种方法是这样的：

<Route path="country/some-static-keyword" render={() => <Country countryId={this.props.countryId}/>}/>