yann-i18n

安装

npm i yann-i18n -S

快速上手

import { useI18n } from 'yann-i18n'; // or import useI18n from 'yann-i18n'

const { useLocale, locale, loadLocaleMessages, mergeLocaleMessage, setLocale } =
  useI18n('zh', {
    zh: {
      index: '首页',
      main: {
        cs: '测试'
      }
    },
    en: {
      index: 'index',
      main: {
        cs: 'params'
      }
    }
  });

const { t } = useLocale();
const index = t('index');
const mainCs = t('main.cs');

// or
const { t: t2 } = useLocale('mian'); // 无法获取到 mian 之外的内容
const mainCs2 = t2('cs'); //它和上面的 mainCs 是一样的

// 修改语言
locale.value = 'en';
// or
setLocale('en');

// 加载新的语言包，如果加载已有的语言包时，会覆盖
loadLocaleMessages('ko', {
  index: '첫 페이지',
  mian: {
    cs: '테스트'
  }
});

// 合并到已有的语言包里
mergeLocaleMessage('zh', {
  content: '内容'
});

介绍

useI18n 返回内容

| 字段 | 描述 | 类型 | | :----------------: | :---------------: | :----------: | | useLocale | 使用语言 | function | | mergeLocaleMessage | 合并已有的语言包 | function | | loadLocaleMessages | 加载新的语言包 | function | | locale | 语言类型 | Ref<string> | | t | vue-i18n 转换函数 | function | | i18n | vue-i18n 实例 | object | | setLocale | 修改语言函数 | function |

修改语言可以通过改变 locale.value 的方式切换，例如 目前已有 zh 和 en 两种语言包，默认 zh，如果需要切换到 en 时，可以编写 locale.value='en' 即可

useLocale 返回内容

| 字段 | 描述 | 类型 | | :----------------: | :---------------: | :---------: | | t | vue-i18n 转换函数 | function | | locale | 语言类型 | Ref<string> | | mergeLocaleMessage | 合并已有的语言包 | function | | loadLocaleMessages | 加载新的语言包 | function | | setLocale | 修改语言函数 | function |

useLocale 函数返回的 t 函数进行了封装，主要是为了便于使用，useLocale 可以多次执行返回不同的 t 函数，在使用时，如果直接 const { t } = useLocale()，那么我们就是正常使用的，例如 t('main.cs')，如果这个里面有很多需要 main 里面的字段时 ，那么写起来就比较麻烦，所以这个时候可以再次执行 useLocale 函数，例如 const { t } = useLocale('main')，那么这个时候在使用时，我们就可以不拼接'mian'了，例如 t('cs') 它等同于上面的 const { t } = useLocale()， t('main.cs');