在组件生命周期内重定向react-router-redux push

时间:2017-01-09 13:12:47

标签: reactjs internationalization redux react-router react-redux

所以我有一个本地化的网站,在某些情况下需要重定向路由。例如,如果用户将其UI设置为西班牙语并转到mysite.com/about,则需要将其重定向到mysite.com/es/about

所以基本上,路由是通过react-router的<{1}}组件重复的:

<Route>

{Object.values(UILanguages).map(locale => { return ( <Route path={`${locale.basepath}`} key={locale.basepath} locale={locale} component={App} status={200}> ...routes go here </Route> ) })} 的{​​{1}}生命周期方法中查看我是否在错误的componentWillMount组件上进行检查是很简单的,但是我必须在我的应用程序中添加每个链接,这是我不想做的。相反,我希望动态重定向外语,如第一段所示。

这怎么可能?

1 个答案:

答案 0 :(得分:0)

使用反应路由器挂钩代替它将更清洁(更小的组件)并且比使用组件生命周期更简单。

https://github.com/ReactTraining/react-router/blob/master/docs/API.md#onenternextstate-replace-callback

在你的情况下,你需要使用所有3个参数,因为第一个是下一个状态,第二个是你要做的重定向,第三个是你完成测试值时要调用的回调。 我可以举例说明如何做到这一点,但我真的不知道你的应用程序是如何构建的,所以请检查这个链接,它对我帮助很大:

https://www.youtube.com/watch?v=JicUNpwLzLY&t=359s

希望这有帮助!

ps:在某些情况下你需要定义onChange钩子的例子:分页......