A provider and hook for adding i18n capabilities into a React application
- uri - the URI endpoint used for loading languages (defaults to /assets/nls)
- language - the I18nLanguage to use as default (defaults to EN)
Assumes that i18n language files are available at the URI provided :-
/assets/nls/en.json
These should be a standard i18n JSON, such as :-
{
"my-i18n-key": "Some sort of text",
"my-other-i18n-key": "Some sort of text with {{value}}",
}
Wrap your React app with the provider
<I18nProvider>
...
</I18nProvider>
and then use the hook inside your components
function MyComponent() {
const i18n = useI18n()
console.log(i18n.lower('my-i18n-key'))
// Some sort of text
console.log(i18n.lower('my-other-i18n-key', {
value: "something"
}))
// Some sort of text with something
}