CODEWITHSUNDEEP
reactjsnext.jsi18next
user391986
user391986

Reputation: 30956

NextJS i18 trigger page reload on locale change

How exactly do I trigger a page reload from the code after user selects the language?

I'm using Next JS 10.0 and the new i18 features so my two urls are

On my react button click I tried

router.push(`/${lang}/Dashboard`)

This works however is there a way where I don't have to manually re-code the current page location?

Upvotes: 4

Views: 6829

Answers (3)

Jason
Jason

Reputation: 53

I had the same issue and I just reload the page after the change language, but first you need to wait till the locale is completely changes then reload the page:

const handleChangeLanguage = (lang) => {
    router.push(router.pathname, router.asPath, {locale: lang});

    router.events.on('routeChangeComplete', () => {
        router.reload()
    });
}

Upvotes: 5

Muljayan
Muljayan

Reputation: 3886

You must not use the lang or locale as part of your url string. Try the following instead.

    router.push('/dashboard', '/dashboard', { locale: 'YOUR_NEW_LOCALE' })

In case you're wondering why there are two '/dashboard', its because the first one goes as a to the second is an as. You can read about it more here

Upvotes: 1

timbersaw
timbersaw

Reputation: 660

You can use

router.reload()

Docs

Upvotes: 1

Related Questions