更新记录

1.0.0（2025-07-16） 下载此版本

本次插件为开放版本，为销售tmui4x向市场贡献的插件，供大家使用，是tmui4x中抽离出来的插件

平台兼容性

云端兼容性

阿里云 腾讯云 支付宝云
√ √ √

uni-app x(4.71)

Chrome Safari Android iOS 鸿蒙 微信小程序
√ √ √ √ - √

其他

多语言 暗黑模式 宽屏模式
√ √ √

x-vuei18n-s

一个为 UniApp-X 设计的国际化(i18n)插件，提供完整的多语言支持功能。 本库为tmui4x提供多语言支持，同时也是开源免费的，不需要tmui4x授权，您即可导入和下载使用 使用时请按照文档安装和使用。 使用方式几乎与源Vu8I18n一致基本没有变化，所以你看我下面的文档和看官方的文档都可以,但部分函数还是有差异的 源官方文档链接

特性

  • 🌍 多语言翻译支持
  • 🔢 复数形式处理
  • 📅 日期时间格式化
  • 💰 数字格式化
  • ⏰ 相对时间格式化
  • 🎯 插值和参数替换
  • 🔄 语言回退机制
  • 📱 跨平台兼容

安装

将插件复制到项目的 uni_modules 目录下即可。 地区语言代码标准见打开链接

在TMUI4x项目中使用

前置条件

你已经使用并安装tmui4x组件库，那么会自带集成，但需要你复制本插件到您的项目中，目录 您的项目 > uni_modules > x-vuei18n-s 接着安装语言包

import App from './App'
import {xui} from "@/uni_modules/tmx-ui/index.uts"
import {Tmui4xOptions} from "@/uni_modules/tmx-ui/interface.uts"

import en from "@/uni_modules/tmx-ui/localLanuage/en.json"
import zhHans from "@/uni_modules/tmx-ui/localLanuage/zh-Hans.json"
import zhHant from "@/uni_modules/tmx-ui/localLanuage/zh-Hant.json"
import ko from "@/uni_modules/tmx-ui/localLanuage/ko.json"
import ja from "@/uni_modules/tmx-ui/localLanuage/ja.json"
// 下方是组件的语言包，以及你自己定义的语言包与组件合并即可。共用一个实例。
const messages : UTSJSONObject = {
    "en":{
        ...en,
        "hellow":"Hi~"
    },
    "zh-Hans":{
        ...zhHans,
        "hellow":"哈喽"
    },
    "zh-Hant":zhHant,
    "ko":ko,
    "ja":ja
}
import { createSSRApp } from 'vue'
export function createApp() {
    const app = createSSRApp(App)
    // 配置语言包
    app.use(xui,{i18nOptions:{locale:"zh-Hans",messages}} as Tmui4xOptions)
    return {
        app
    }
}

在Uvue内使用

组合式模板内

import {xStore} from "@/uni_modules/tmx-ui/index.uts"
const i18n = xStore.xConfig.i18n
console.log(i18n.t('xx.x'))

uts内导入后可以在模板内使用

<x-text>{{i18n.t('xx.x')}}</x-text>

选项式模板内

它已经集成了,不需要向组合式那样再导入.

export default {
    methods:{
        test():string{
            return this!.i18n.t('xx.x')
        }
    }
}

它已经集成了,不需要向组合式那样再导入.

<x-text>{{i18n!.t('xx.x')}}</x-text>

在任意Uts中使用

import {xStore} from "@/uni_modules/tmx-ui/index.uts"
const i18n = xStore.xConfig.i18n
console.log(i18n.t('xx.x'))

作为插件集成到您应用中（非tmui4x项目）

前置条件

你需要在main.uts中安装插件

import { tmxI18n} from "@/uni_modules/x-vuei18n-s/index.uts"
import { I18nOptions} from "@/uni_modules/x-vuei18n-s/interface.uts"

const config = {locale:'zh'} as I18nOptions
app.use(tmxI18n,config)

在下面的2和3取得的i18n均为多语言实例，你可以调用前面的实例方法动态添加语言或者切语言等

1.在Vue模板内使用

    <x-text>{{i18n.t('cnacel')}}</x-text>

2.在组合式代码内使用

    import {getCurrentInstance} from "vue"
    const i18n = getCurrentInstance()?.proxy?.$i18n()
    //可选
    console.log(i18n?.t('confirm'))
    //断言
    console.log(i18n!.t('confirm'))

3.在选项式代码内使用

    export default {
        methods:{
            test():string{
                return this!.i18n.t('confirm')
            }
        }
    }

4.在任意文件中使用

这里说的是你脱离了vue模板，比如在非setup和选项式中使用时，前面的方式就不行了，因为前面是依赖于vue实例。 此种方式是只使用插件模式不需要在main.uts中app.use安装本插件，即可在任意位置导入使用。包括在vue模板内（不分组合式和选项都能用） 如果你想在模板内使用本方式 不要再使用i18n变量名了 因为本身在模板内就有全局的i18n。

任意uts代码中

import { $i18n } from "@/uni_modules/x-vuei18n-s/index.uts"
const la = $i18n()
// uts文件中就可以使用了。
console.log(la.t('xx.x.x.'))
//模板内

vue模板内

import { $i18n } from "@/uni_modules/x-vuei18n-s/index.uts"
const la = $i18n()
<x-text>{{la.t('xx.x.x.')}}</x-text>

快速开始

基本使用

import { $i18n} from "@/uni_modules/x-vuei18n-s/index.uts"
const i18n = $i18n();
// 设置中文消息
const zhMessages: UTSJSONObject = {
  'hello': '你好',
  'welcome': '欢迎使用UniApp-X',
  'user': {
    'name': '用户名',
    'age': '年龄'
  },
  'items': {
    'apple': '苹果 | 苹果们 | {count}个苹果'
  },
  'greeting': '你好，{name}！'
}

// 设置英文消息
const enMessages: UTSJSONObject = {
  'hello': 'Hello',
  'welcome': 'Welcome to UniApp-X',
  'user': {
    'name': 'Username',
    'age': 'Age'
  },
  'items': {
    'apple': 'apple | apples | {count} of apple'
  },
  'greeting': 'Hello, {name}!'
}
i18n.mergeLocaleMessage('zh',zhMessages)
i18n.mergeLocaleMessage('en',enMessages)
// 设置当前语言
i18n.setLocale('zh')

API 文档

创建实例

如果是在uvue模板内，可以参照文档尾部的使用方法。

import { $i18n} from "@/uni_modules/x-vuei18n-s/index.uts"
const i18n = $i18n();

翻译方法 t()

基本翻译：

i18n.t('hello') // '你好'
i18n.t('user.name') // '用户名'

带参数的翻译：

i18n.t('greeting', { name: '张三' }) // '你好，张三！'

复数形式：

i18n.t('items.apple', 1) // '苹果'
i18n.t('items.apple', 2) // '苹果们'
i18n.t('items.apple', 5, { count: 5 }) // '5个苹果'

数字格式化 n()

// 基本数字格式化
i18n.n(1234.56) // '1234.56'

// 货币格式化
i18n.n(1234.56, null, {
  style: 'currency',
  currency: 'CNY'
}) // '¥1,234.56'

// 百分比格式化
i18n.n(0.85, null, {
  style: 'percent'
}) // '85%'

日期时间格式化 d()

const date = new Date()

// 基本日期格式化
i18n.d(date) // '2024/1/15'

// 自定义格式
i18n.d(date, null, {
  year: 'numeric',
  month: 'long',
  day: 'numeric'
}) // '2024年1月15日'

// 时间格式化
i18n.d(date, null, {
  hour: '2-digit',
  minute: '2-digit',
  second: '2-digit'
}) // '14:30:25'

相对时间格式化 rt()

// 相对于当前时间
i18n.rt(new Date()) // '刚刚'

// 指定时间字符串
i18n.rt('2025-7-8 20:4:50', 'second') // '6个月后'

// 时间戳
i18n.rt(Date.now() + 3600000, 'minute') // '1小时后'

// 自动单位进阶
i18n.rt(Date.now() + 90000, 'second') // '1分钟后' (90秒自动转为分钟)

翻译键存在性检测 te()

// 检测翻译键是否存在
i18n.te('hello') // true
i18n.te('user.name') // true
i18n.te('nonexistent.key') // false

// 检测指定语言中的翻译键
i18n.te('hello', 'zh') // true
i18n.te('hello', 'en') // true
i18n.te('hello', 'fr') // false (如果没有法语语言包)

// 检测嵌套键
i18n.te('user.settings.theme') // true
i18n.te('user.nonexistent') // false

语言管理

// 获取当前语言
const currentLocale = i18n.getLocale() // 'zh'

// 设置语言
i18n.setLocale('en')

// 获取可用语言列表
const locales = i18n.availableLocales() // ['zh', 'en']

// 动态添加语言内容
i18n.mergeLocaleMessage('zh', {
  'newKey': '新内容'
})

高级功能

复数规则自定义

// pluralRule
const i18n.ops = (choice: number, choicesLength: number) => {
    // 自定义复数规则
    if (choicesLength === 2) {
      return choice === 1 ? 1 : 0
    }
    return choice === 0 ? 0 : choice === 1 ? 1 : 2
  }
}

回退语言设置

i18n.setLocale('zh')
i18n.setFallbackLocale('en')

预定义格式

// 数字格式预定义
i18n.ops.numberFormats.set('zh', new Map([
  ['currency', {
    style: 'currency',
    currency: 'CNY',
    currencyDisplay: 'symbol'
  }]
]))

// 使用预定义格式
i18n.n(1234.56, 'currency') // '¥1,234.56'

注意事项

  1. 消息对象必须使用 UTSJSONObject 类型
  2. 复数形式使用 | 分隔不同的形式
  3. 插值参数使用 {key} 格式
  4. 相对时间会自动选择最合适的单位
  5. 支持嵌套的消息键（如 user.name）

许可证

请不要随意更改源码，你仅有使用权。

隐私、权限声明

1. 本插件需要申请的系统权限列表：

无

2. 本插件采集的数据、发送的服务器地址、以及数据用途说明：

无

3. 本插件是否包含广告，如包含需详细说明广告表达方式、展示频率：

无

许可协议

MIT协议
评论列表 撰写评论 向官方投诉

暂无用户评论。

插件问答 我要提问

使用中有什么不明白的地方，就向插件作者提问吧~ 我要提问

加载更多...