Hi, just had this use case and couldn't figure out how I would do this.
Before I turn on locale subpath, I basically just did location.reload() to reload the page after changing the language, but after I turn on locale subpath, I am no longer able to do that, as reloading the current url would simply revert the changed locale. And using Router is only doing a client side router push.
The reason why I needed to reload the page is because I have some locale specific content that gets fetched on SSR, and that content will need to be refetched after the locale is changed, and refreshing the page is the easiest way
One solution I can think of is to get the locale before changing the locale, swapping the old locale in the url with the new locale, and replacing location.href. Seems a bit hacky to me, just wondering if there is a more elegant way
I'm looking for a different solution. Instead to reload the whole page I would like to rerender getInitialProps on language change.
Your issue describes a race condition because you didn't wait for the locale change. Execute window.location.reload() in the callback of the i18n.changeLanguage(locale, cb) and it should work.
Unrelated to this package. Please post on StackOverflow for general React questions.
@StarpTech Thanks for the help that did the work
Unfortunately location.reload() didn't work as I thought it was when locale subpath is used. The old locale will simply be reloaded and set to the cookie after triggering location.reload().
I looked everywhere and I couldn't find a way to get the router asPath without locale in it
The reason why I needed to reload the page is because I have some locale specific content that gets fetched on SSR, and that content will need to be refetched after the locale is changed, and refreshing the page is the easiest way
@mengqing which version do you use? In the latest version, a locale change will always result in a refresh of getInitialProps.
is there way to change language without reloading whole page, client side only, i.e. react-way?
Most helpful comment
is there way to change language without reloading whole page, client side only, i.e. react-way?