Next-i18next translation on the fly

Question

Is there a way to translate something using the next-i18next library without changing the locale with router.push?

I have 3 locales: ['en', 'de', 'fr'], the default being de. When I am trying to do something like:

import {useTranslation} from 'next-i18next'

const Component = () => {
  const { t } = useTranslation("common");
  console.log(t('word', { lng: 'fr' }));
}

while my current locale is de, it returns the de translated version, not the fr.

Answer 1

If refer to this doc https://react.i18next.com/latest/usetranslation-hook there is no possibility to translate something without change whole system language, you can change system language using 2 ways:

one you described router.push

another is:

const { t, i18n } = useTranslation();

i18n.changeLanguage('de');
console.log( t('word') );
i18n.changeLanguage('en-US');

But this solution is very ugly because you will switch whole system lang just for very small log.

If you will describe real case, probably a can help you find real solution. Real case means why you need log translated word on DE and so on.