Translate
Provides translation API using context interfaces.
<Translations>
Translation provider, use it to broadcast your translation map. You can have multiple nested
translations providers, where child provider will overwrite parent's translations. Also, you
can have different translation providers at the same time, using the namespace ns
prop.
Usage
import {Translations} from 'libreact/lib/translate';
<Translations map={{
key: 'value',
bye: 'ciao'
}}>
<App />
</Translations>
Props
interface ITranslationsProps {
map: {[key: string]: string | ((T, ...args) => string)};
ns?: string;
}
, where
map
- required, object, a dictionary of translations.ns
- optional, string, namespace.
<Translate>
or <T>
Translation consumer render prop component that receives translation function T
, which has the following signature
T: (key: string, ...args) => string;
<Translate>
component has also a shorthand alias <T>
component.
Usage
import {Translations, T} from 'libreact/lib/translate';
<Translations map={{
key: 'value',
bye: 'ciao'
}}>
<T>{(t) =>
<span>Goodbye is ${t('bye')}</span>
}</T>
</Translations>
Props
interface ITranslateProps {
ns?: string;
}
, where
ns
- optional, string, namespace.
withT()
HOC
withT
is an enhancer that injects T
function into your component.
import {withT} from 'libreact/lib/translate';
const MyCompWithT = withT(MyComp);
@withT
decorator
Component class decorator that injects T
function into your component.
import {withT} from 'libreact/lib/translate';
@withT
class MyComp extends Component {
}