Internationalization (I18N) for reactJs

Tue, Jan 1, 2019 One-minute read

Internationalization (I18N) for reactJs(@spl-soft-react/language) Other packages(spl-soft-react)

Installation

npm install @spl-soft-react/language --save

Usage

Copy message folder to and wrap your app with LanguageProvider.

import { LanguageProvider } from '@spl-soft-react/language';
import messages from 'project/src/messages'
 
<LanguageProvider message={messages}>
    <App />
</LanguageProvider>

and then use withAlert hoc component to call alert

import { withI18n } from '@spl-soft-react/language';
 
class Example extends React.Component {
  render() {
    const { t, setlanguagecode } = this.props;
    return (
      <div >
        <h1>{t("hello")}</h1>
        <p>{t('update {module-name}', {'module-name': t('product')})}</p>
 
        <button onClick={()=>setlanguagecode('en')}>English</button>
        <button onClick={()=>setlanguagecode('my')}>Myanmar</button>
        <button onClick={()=>setlanguagecode('zg')}>Myanmar Zawgyi</button>
      </div>
    );
  }
}
 
export default withi18n(Example);