前端组件上新:全球数字&货币符号展示的“标准答案”

9 阅读2分钟

引言

在企业级系统中,有大量的数字和金额展示需求,比如:订单金额、成本预算、税率、数量、单价等等。

但你是否注意过,同一个数字,不同国家、地区的用户,对数字的阅读和输入方式有着不同标准:

  • 中国: 1,234.56
  • 美国: 1,234.56
  • 德国: 1.234,56
  • 法国: 1 234,56

我们期望数字的呈现与应用方式能够符合各个地区的标准,从而避免用户不得不去适应系统的情况。

🌍一套组件,适配全球数字与货币标准

NumberField(数字输入框) 和 Currency(货币输入框),围绕“格式化”做了大量细致设计。

01 数字格式可配置,真正符合地区标准

  • 支持按 语言 / 地区(lang) 格式化数字
  • 自动处理: ⊙ 千分位符( , / . / 空格) ⊙ 小数点符号( . / , ) ⊙ 数字分组规则

原数据 468123456.789 ,在不同地区格式化如下: 📌 关键设计点:同一系统,既能“统一规范”,也能“灵活定制” 数字格式可在 H-ZERO 个人中心统一配置 也支持开发者在具体功能中 局部覆盖

02 货币 + 数字格式自由组合

Currency 组件在 NumberField 的基础上,进一步增强了对实际业务中货币处理复杂性的支持:

  • 支持多种货币符号:包括但不限于人民币(¥)、美元($)、欧元(€)和英镑(£)等。

  • 灵活的货币符号位置配置: ⊙ 前置显示,例如 $ 1,234.56 ⊙ 后置显示,例如 1.234,56 €

  • 与地区化数字格式无缝组合:自动遵循不同国家和地区的书写习惯

  • 同一个组件即可自然适配: CN 中国财务系统 US 北美 SaaS 系统 DE 德国 / 欧洲企业应用

原数据 468123456.789 ,在不同地区货币格式化如下:

✍️显示 ≠ 输入?我们选择继续优化

在很多系统中,显示格式和输入格式不一致,引起了不好的使用体验: 显示: 1.234,56 输入却只能敲: 1234.56

✅ 新增能力:输入与显示格式保持一致

  • 如果当前地区小数点是“逗号”
  • 那么输入时也支持直接输入“逗号”
  • 所见即所得,减少理解和转换成本 例如德国地区聚焦输入“逗号”小数点:

结语

根据各国际化项目所提供的反馈与建议,我们已实现了上述功能,确保数字及其货币的展示与应用方式能够满足不同地区的标准和规范。

若您有进一步的国际化需求,敬请随时与我们联系。

欢迎试用

欢迎试用 H-ZERO 开发平台。如果您有更好的想法和建议,欢迎您积极反馈给我们。

NumberField 数字输入框

Currency 货币输入框

大数字支持