React - language system - jak to może wyglądać?

0

Powiedzmy że mam komponent i w zależności od języka chciałbym wyświetlić Hello, Cześć, itd...

const Informatiion = () => {
    return <div>{translation('helloKey')}</div>
}

i teraz kwestia gdzie te wszystkie dane trzymać? bo chyba nie będę pobierał jakiegoś jsona po te wszystkie przetłuaczone rzeczy na początku.Teraz się zastanawiam w jaki fajny i wydajny sposób można to zrobić w react?.

0

Dokładnie tak, pobierzesz jsona - na dodatek mozna przez require pobierac dokladnie tego jsona ktory jezyk chcesz wczytac.

0

ale to react a nie node.... cchyba nie zrouzmiałem co napisałes

0

Mówisz, że w react nie możesz zrobić require?

1

Zobacz sobie na https://react.i18next.com/

Dane trzymasz sobie w Jsonie. Osobny Json dla każdego języka.

Przykład:

init

import langPL from "./pl.json"
import langEN from "./en.json"

  newInstance.use(initReactI18next).init({
        interpolation: { escapeValue: false },
        lng: 'en',    
        resources: {
            pl: {
                common: langPL
            },
            en: {
                common: langEN
            },
        },
    });

en.json

{
    "button": {
        "save": "Save",
     }
}

pl.json

{
    "button": {
        "save": "Zapisz",
     }
}

Użycie

 const {t} = useTranslation('common');
return(
<div c>{t('button.create')}</div>
)

Zmiana języka

i18n.changeLanguage(lang);

lang to nazwa z init
React sobie podmieni napisy.

1 użytkowników online, w tym zalogowanych: 0, gości: 1