React Router翻译路由的最佳方式

Question

我正在构建一个react应用程序，该应用程序需要有3种语言
现在，它只有英文版-我正在使用react路由器来管理页面。

我不需要翻译，我已经有了翻译，但我不知道如何在我的应用程序中实现这些
将我的项目复制3次到/en、/it、/fr听起来效率很低。

有什么建议吗？

<Router >
<div>
<Switch>
<Route exact path="/contact" component={Contact}  />
<Route exact path="/where" component={Where}  />
<Route exact path="/about" component={About}  />
<Route exact path="/" component={Home}  />
<Route component={NotFound}  />
</Switch>
</div>
</Router>

Answer 1

您可以将Router params用于语言

<Router >
<Route path="/:language" component={Localise}/>
</Router>

和本地组件

render() {
const {language} = this.props.match.params; 
return (
<div>
<Switch>
<Route exact path=`${match.path}/contact` component={Contact}  />
<Route exact path=`${match.path}/where` component={Where}  />
<Route exact path=`${match.path}/about` component={About}  />
<Route exact path={match.path} component={Home}  />
<Route component={NotFound}  />
</Switch>
</div>
)
}