react-i18n-hook

A concise React hook for i18n

Usage no npm install needed!

<script type="module">
  import reactI18nHook from 'https://cdn.skypack.dev/react-i18n-hook';
</script>

README

react-i18n-hook

NPM JavaScript Style Guide

Install

npm install --save react-i18n-hook

Usage

import React from 'react';
import ReactDOM from 'react-dom';
import { I18nProvider } from 'react-i18n-hook';

import App from './App';

const translations = {
  en: {
    name: 'jason',
    gender: 'boy'
  },
  cn: {
    name: '涂',
    gender: '男'
  }
};
ReactDOM.render(
  <I18nProvider locale="en" translations={translations}>
    <App />
  </I18nProvider>,
  document.getElementById('root')
);

import { useI18n, useLocale } from 'react-i18n-hook';

const App = props => {
  const [translate] = useI18n();
  const [locale, setLocale] = useLocale();

  return (
    <div>
      <div>name: {translate('name')}</div>
      <div>gender: {translate('gender')}</div>
      <div>current lang: {locale}</div>
    </div>
  );
};

License

c © zenghongtu