通过 Upwork 认识我? 如果您是通过 Upwork 找到我并希望合作,请通过 Upwork 联系我。Upwork 客户在 Upwork 之外发送的消息将不会得到回复。
本地化笔记🌏 本地化

React Native 越南语本地化:Expo、i18n、VND 与日期格式

为 React Native 应用添加越南语:expo-localization 配置、i18n 库选择、VND 整数货币格式及日-月-年日期显示,助力进入越南市场。

Dao Huy (Lucas)7分钟8 节
React Native 越南语本地化:Expo、i18n、VND 与日期格式

💡 React Native 添加越南语只需一个下午:安装 expo-localization,读取 getLocales()[0].languageCode 检测到 vi,接入 i18n-js 或 react-i18next 管理翻译,用 Intl.NumberFormat('vi-VN', { style: 'currency', currency: 'VND', maximumFractionDigits: 0 }) 格式化越南盾,日期显示为 dd/MM/yyyy 格式。越南语名词无数量变化,一个翻译键可覆盖所有数量情形。

要点

  • 安装 expo-localization,调用 getLocales()[0].languageCode 获取越南设备上的 vi。将其存入 state 并传给 i18n 库。
  • 越南语名词不因数量变形。一个翻译键同时处理"1 个商品"和"5 个商品",无需单独的单数分支。
  • 越南盾无辅助单位:使用 Intl.NumberFormat('vi-VN', { style: 'currency', currency: 'VND', maximumFractionDigits: 0 }),点号(.)为千位分隔符。
  • 越南语日期顺序为日-月-年。10 月 11 日写作 11/10,而非 10/11。使用 Intl.DateTimeFormat 配合 vi-VN 语言区域。
  • 在 Flexbox 布局中预留 20-30% 额外横向空间:越南语附加符使字符串比英语更宽。避免为按钮和选项卡使用固定宽度容器。

如何在 React Native 应用中检测并设置越南语?

expo-localization 是读取设备语言区域的推荐方式。通过 npx expo install expo-localization 安装,然后在启动时调用 getLocales():

import { getLocales } from 'expo-localization';

const deviceLang = getLocales()[0]?.languageCode ?? 'en'; // 越南设备返回 'vi'
const deviceTag  = getLocales()[0]?.languageTag  ?? 'en-US'; // 'vi-VN'

getLocales() 返回用户偏好语言的有序列表,第一个元素是主要语言区域。越南语的 languageCode 为 vi,languageTag 为 vi-VN。将 deviceLang 作为初始语言传入翻译库,存入 React state 或 context,以便用户切换设备语言时界面同步更新。

对于不使用 Expo 的 bare React Native 项目,社区包 react-native-localize 提供相同的 getLocales() API,无需 Expo 工具链。

哪个翻译库最适合越南语?

Expo 文档列出四种选择:i18n-js、react-i18next、Lingui 和 Intlayer。越南语与所有这些库均兼容。实际权衡如下:

  • i18n-js:轻量(约 10 kB),使用简单的 JSON 翻译文件,非工程师也能维护字符串。适合小型至中型应用,翻译人员直接编辑 JSON。
  • react-i18next:生态系统中使用最广泛的方案。支持 ICU MessageFormat、命名空间、懒加载和后端插件远程获取翻译。最适合多页面应用或使用翻译管理系统(Trados、Crowdin、Lokalise)的团队。
  • Lingui:出色的 TypeScript 支持和编译时字符串提取。适合注重类型安全的团队。

三者均导出 JSON 格式的翻译文件。越南语译员无需接触代码即可进行任意一种。对于需要对接 TMS 的团队,react-i18next 拥有最广泛的集成支持。

越南语在 i18n 库中如何处理复数规则?

Unicode CLDR 复数规则为越南语定义了两个类别:one(n=0 或 n=1)和 other(所有其他值)。然而越南语名词无数量变形。"1 sản phẩm"和"5 sản phẩm"使用同一个词,这与中文完全相同。实际上,other 翻译可覆盖所有情形,只需为空载状态单独提供一个条目:

// i18n-js 越南语翻译文件:vi.json
{
  "cart": {
    "items_zero": "Giỏ hàng trống",
    "items_one":  "{{count}} sản phẩm",
    "items_other":"{{count}} sản phẩm"
  }
}

items_one 和 items_other 完全相同,这是刻意为之。越南语量词(cái、con、chiếc)因名词类别而异,但这是每个名词的固定属性,而非随数量变化的语法规则。机器翻译经常用错量词,母语者能立即察觉。

React Native 中的 VND 货币与日期格式

JavaScript 的 Intl.NumberFormat 通过 JSC/Hermes 在 iOS 和 Android 上均可用。VND 无辅助单位,请设置 maximumFractionDigits: 0。越南语使用点号(.)分隔千位,逗号(,)为小数点,与英语相反:

const vndFmt = new Intl.NumberFormat('vi-VN', {
  style: 'currency',
  currency: 'VND',
  maximumFractionDigits: 0,
});

vndFmt.format(1250000); // "1.250.000 ₫"

省略 maximumFractionDigits: 0 在某些运行时版本上会产生错误的"1.250.000,00 ₫"。请务必显式设置。

越南语日期顺序为日-月-年。2026 年 10 月 11 日写作"11/10/2026"。显示"10/11"会让越南用户误读为 11 月 10 日。使用带 vi-VN 语言区域的 Intl.DateTimeFormat,或搭配 vi 语言区域的 date-fns 库。

越南语文本为何需要更多屏幕空间?

越南语将基础字母与最多两个叠加附加符组合。字符"ộ"(o + 帽形符 + 下点)在视觉上比普通拉丁字母更宽。越南语字符串平均比英语对应内容宽 20-30%。"Settings"(8 字符)变成越南语后字符更少但视觉更宽,"Notifications"类似。

使用弹性宽度构建 Flexbox 布局。对按钮和选项卡使用 flex: 1 而非固定 width。发布前务必在越南语激活状态下测试。DataReportal 2025 越南数字报告显示,越南拥有 1.27 亿移动网络连接,远超其 1.01 亿总人口,绝大多数越南用户通过手机使用您的应用。

哪些工作可内部完成,何时需要越南语本地化专家?

整个技术 pipeline(expo-localization、i18n 库、Intl 格式化)完全在开发团队能力范围内,只需几小时。所得字符串将在语法上正确。非母语翻译容易出现的问题:

  • 语体不符:B2B 金融科技和企业软件使用汉越词汇,消费类应用使用日常越南语。机器翻译常混淆两种语体,给母语用户不一致的感受。
  • 量词错误:con 用于动物,cái 用于无生命物体,chiếc 用于车辆或成对物品。机翻经常用错,母语者能立即察觉。
  • UI 边界场景:错误提示、空载界面和确认对话框需要自然的越南语。在关键时刻语气生硬会损伤用户信任。

机翻初稿后,一次 越南语本地化专家审校 就能发现大部分问题。金融、医疗或法律类应用请在翻译前制定术语表,以保证界面语言一致性。

常见问题

expo-localization 能在不使用 Expo 的 bare React Native 项目中使用吗?

可以,但有前提。expo-localization 是 Expo 模块,需要在项目中安装 Expo Modules API。对于完全不依赖 Expo 的 bare React Native 项目,请使用 react-native-localize,它提供相同的 getLocales() API,无需 Expo 工具链。

如何在 iOS 模拟器中测试越南语界面?

在 Xcode 中,打开 scheme editor(Cmd+Shift+,),选择 Run scheme,打开 Options 标签,将 Application Language 设置为 Vietnamese。模拟器将以越南语语言区域重启。在 Android 上,进入设置 - 通用管理 - 语言 - 添加语言 - 越南语,然后将其移到列表顶部。

翻译文件应打包在应用内还是从服务器加载?

将核心界面的翻译(导航、设置、错误提示)打包在应用内,确保离线可用。对频繁更新的内容(营销文案、功能公告)使用远程加载(react-i18next 后端或 Expo Updates)。越南语核心界面字符串通常只增加不到 20 KB 的应用体积。

可以用 Google 翻译或 DeepL 生成越南语翻译吗?

用于初稿是可以的。现代神经机器翻译对基础导航文本的越南语处理达到可用水平。实际限制在于语体和量词准确性:B2B 软件词汇和名词量词是机器翻译输出最需要母语者修正的地方。

languageCode "vi" 和 languageTag "vi-VN" 有什么区别?

languageCode 是 ISO 639-1 两字母语言标识符,vi 表示越南语,不限地区。languageTag 是结合语言和地区的 BCP 47 标签:vi-VN 表示越南境内使用的越南语。为 Intl.NumberFormat 和 Intl.DateTimeFormat 传入 vi-VN 以获取越南格式惯例(点号千位分隔符、日期以日开头)。为翻译库传入 vi,除非需要区分地区变体。

参考来源

Dao Huy (Lucas)
Dao Huy (Lucas)
岘港大学外国语大学毕业。每份认证翻译均附签名的准确性声明(USCIS、IRCC)。

作者:Đào Huy(Lucas),越南语译员与本地化专家(英、中、法译越)。 See translation services →

报价WhatsApp