Реагировать: обновить параметры запроса URL при изменении языка - PullRequest
0 голосов
/ 05 марта 2020

Я создаю многоязычный веб-сайт, и мне нужно отобразить текущий выбранный язык в параметрах URL-запроса (не только язык, но и KISS я рассмотрю только это).

Я использую response-intl для перевода веб-сайтов, а также для сохранения текущего выбранного языка в избыточном.

Вот как выглядит мой текущий маршрутизатор (HashRouter):

  return (
    <div className="App">
      <Provider store={store}>
        <Router hashType="noslash">
          <Content />
        </Router>
      </Provider>
    </div>
  );
}

let Content = connect(state => ({ language: state.common.language }))(props => {
  const lang = props.language;

  return (
    <IntlProvider locale={lang} messages={messages[lang]}>
      <Switch>
        <Route path='/station_forecasts'>
          <StationForecastsPage />
        </Route>
        <Route path="/">
          <Redirect
            to={{
              pathname: "/station_forecasts",
              search: "?sid=76"
            }}
          />
        </Route>
      </Switch>
    </IntlProvider>
  );
});

Мой текущий подход заключается в добавлении следующего строки до StationForecastsPage компонента:

  useEffect(() => {
    history.push({
      pathname: `${window.location.href}`,
      search: `?lang=${lang}`
    });
  });

, где lang - код языка, взятый из хранилища избыточных данных. Однако это приводит к бесконечному значению l oop, и React выдает ошибку превышения максимальной глубины.

Я мог бы также использовать трюк window.location.href, но это вызвало бы обновление страницы sh, которое, очевидно, не работает для меня.

Мой вопрос: каков наилучший способ реализации вышеупомянутого обновления параметров запроса?

...