国际化

WinDesign Next 组件默认使用简体中文,如果你希望使用其他语言,你可以参考下面的方案。

全局配置

WinDesign Next 提供了全局配置国际化的配置。

main.ts
ts
import WinDesignNext from 'win-design-next'
import enUS from 'win-design-next/es/locale/lang/en'

app.use(WinDesignNext, {
  locale: enUS,
})

ConfigProvider

WinDesign Next 还提供了一个 Vue 组件 ConfigProvider 用于全局配置国际化的设置。

App.vue
vue
<template>
  <w-config-provider :locale="enUS">
    <app />
  </w-config-provider>
</template>

<script setup lang="ts">
import { WConfigProvider } from 'win-design-next'
import enUS from 'win-design-next/es/locale/lang/en'
</script>

日期和时间本地化

我们使用 Day.js 库来管理组件的日期和时间,例如 DatePicker。 必须在 Day.js 中设置一个适当的区域,以便使国际化充分发挥作用。 您必须分开导入 Day.js 的区域设置。

ts
import 'dayjs/locale/zh-cn'

完整文档详见: ConfigProvider

  • 简体中文(zh-cn)
  • 美国英语(en)
  • 葡萄牙语(pt)
  • 繁体中文(zh-tw)
  • 巴西葡萄牙语(pt-br)
  • 中国香港 (zh-hk)
  • 中国澳门 (zh-mo)
  • 越南语 (vi)

Copyright 2025 Winning Health 版权所有