Question

我正在构建一个反应应用，该应用需要3种语言版本。
现在，它只有英文版本-我正在使用React Router来管理页面。

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

有什么建议吗？

     <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参数作为语言

<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>
    )
}

React-Router转换路线的最佳方法？

1 个答案: