i18n

在App.js等最上層元件新增以下

import tw from './i18n/zh-tw'
import en from './i18n/en'

//預設語言
if(!localStorage.getItem('lang')) {
  localStorage.setItem('lang', 'zh-TW')
}

window.lang = (data) => {
  if(localStorage.getItem('lang') === "zh-TW") {
    return tw[data]
  }
  if(localStorage.getItem('lang') === "en") {
    return en[data]
  }
}
window.changeLang = (lang) => {
  localStorage.setItem('lang', lang);
  location.reload();
}

之後新增/i18n/en

module.exports = {
  login: 'Login',
};

/i18n/tw

module.exports = {
  login: '登入',
};

然後在頁面使用

  render() {
    const l = window.lang;
    return (
      <div>
        {l('lobby')}
      </div>
    );
  }

偵測瀏覽器語言var userLang = navigator.language || navigator.userLanguage;

Last updated