Overview
Translation Function
Essentials
Accessing keys
resources with 2 keys:
1
{
2
"key": "value of key",
3
"look": {
4
"deep": "value of look deep"
5
}
6
}
Copied!
sample
1
i18next.t('key');
2
// -> "value of key"
3
​
4
i18next.t('look.deep');
5
// -> "value of look deep"
Copied!
Passing a default value
You can pass in a default value for cases the key could not be found in translations like:
1
i18next.t('key', 'default value to show');
Copied!
In case you're using the saveMissing functionality, it will also pass the defaultValue to your chosen backend, like shown in this React.js example.
Accessing keys in different namespaces
Namespaces are a feature in i18next internationalization framework which allows you to separate translations that get loaded into multiple files.
init
1
i18next.init({
2
ns: ['common', 'moduleA'],
3
defaultNS: 'moduleA'
4
});
Copied!
moduleA.json
1
{
2
"name": "Module A"
3
}
Copied!
common.json
1
{
2
"button": {
3
"save": "save"
4
}
5
}
Copied!
sample
1
i18next.t('name');
2
// -> "Module A"
3
​
4
// from different namespace (not recommended with namespace prefix when used in combination with natural language keys)
5
i18next.t('common:button.save') // -> "save"
6
// better use the ns option:
7
i18next.t('button.save', { ns: 'common' }) // -> "save"
Copied!
Multiple fallback keys
Calling the t function with an array of keys enables you to translate dynamic keys providing a non specific fallback value.
As a sample think of an error code you get and you like to show a specific warning in some cases:
keys
1
{
2
"error": {
3
"unspecific": "Something went wrong.",
4
"404": "The page was not found."
5
}
6
}
Copied!
sample
1
// const error = '404';
2
i18next.t([`error.${error}`, 'error.unspecific']); // -> "The page was not found"
3
​
4
// const error = '502';
5
i18next.t([`error.${error}`, 'error.unspecific']); // -> "Something went wrong"
Copied!
Overview options
i18next.t(key, options)option
description
defaultValue
defaultValue to return if a translation was not found, you also can define defaults for plurals by adding defaultValue_plural / defaultValue_2 -> _suffix depends on same pluralrules.
count
context
replace
lng
override language to use
lngs
override languages to use
fallbackLng
ns
override namespaces (string or array)
keySeparator
override char to separate keys
nsSeparator
override char to split namespace from key
returnObjects
accessing an object not a translation string (can be set globally too)
joinArrays
char, eg. '\n' that arrays will be joined by (can be set globally too)
postProcess
interpolation
skipInterpolation
skip interpolation and nesting for this call to t function
ignoreJSONStructure
if a key is not found as nested key, it will try to lookup as flat key
Last modified 1mo ago