x-vuei18n-s

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

特性

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

Harmony	IOS	Android	WEB	小程序
支持	支持	支持	支持	支持

安装

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

在TMUI4x项目中使用

前置条件

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

uts

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内使用

组合式模板内

uts

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

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

vue

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

选项式模板内

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

uts

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

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

vue

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

在任意Uts中使用

uts

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

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

前置条件

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

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模板内使用

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代码中

uts

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

vue模板内

uts

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

vue

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

快速开始

基本使用

typescript

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

typescript

// 设置中文消息
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模板内，可以参照文档尾部的使用方法。

typescript

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

翻译方法 t()

基本翻译：

typescript

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

带参数的翻译：

typescript

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

复数形式：

typescript

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

数字格式化 n()

typescript

// 基本数字格式化
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()

typescript

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()

typescript

// 相对于当前时间
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()

typescript

// 检测翻译键是否存在
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

语言管理

typescript

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

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

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

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

高级功能

复数规则自定义

typescript

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

回退语言设置

typescript

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

预定义格式

typescript

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

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

注意事项

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

许可证

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

更新日志

1.0.0（2025-07-16）

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

x-vuei18n-s ​

特性 ​

安装 ​

在TMUI4x项目中使用 ​

前置条件 ​

在Uvue内使用 ​

组合式模板内 ​

选项式模板内 ​

在任意Uts中使用 ​

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

前置条件 ​

1.在Vue模板内使用 ​

2.在组合式代码内使用 ​

3.在选项式代码内使用 ​

4.在任意文件中使用 ​

快速开始 ​

基本使用 ​

API 文档 ​

创建实例 ​

翻译方法 t() ​

数字格式化 n() ​

日期时间格式化 d() ​

相对时间格式化 rt() ​

翻译键存在性检测 te() ​

语言管理 ​

高级功能 ​

复数规则自定义 ​

回退语言设置 ​

预定义格式 ​

注意事项 ​

许可证 ​

更新日志 ​

1.0.0（2025-07-16） ​

x-vuei18n-s

特性

安装

在TMUI4x项目中使用

前置条件

在Uvue内使用

组合式模板内

选项式模板内

在任意Uts中使用

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

前置条件

1.在Vue模板内使用

2.在组合式代码内使用

3.在选项式代码内使用

4.在任意文件中使用

快速开始

基本使用

API 文档

创建实例

翻译方法 t()

数字格式化 n()

日期时间格式化 d()

相对时间格式化 rt()

翻译键存在性检测 te()

语言管理

高级功能

复数规则自定义

回退语言设置

预定义格式

注意事项

许可证

更新日志

1.0.0（2025-07-16）