2018-03-20 11:06:04 +00:00
|
|
|
|
# LocaleProvider 国际化
|
|
|
|
|
|
|
|
|
|
为组件内建文案提供统一的国际化支持。
|
|
|
|
|
|
|
|
|
|
## 使用
|
|
|
|
|
|
|
|
|
|
LocaleProvider 使用 Vue 的 [provide/inject](https://cn.vuejs.org/v2/api/#provide-inject) 特性,只需在应用外围包裹一次即可全局生效。
|
|
|
|
|
|
|
|
|
|
````html
|
|
|
|
|
<template>
|
|
|
|
|
<a-locale-provider :locale="zh_CN">
|
|
|
|
|
<App />
|
2018-05-08 03:33:58 +00:00
|
|
|
|
</a-locale-provider>
|
2018-03-20 11:06:04 +00:00
|
|
|
|
</template>
|
|
|
|
|
<script>
|
2018-08-04 09:52:11 +00:00
|
|
|
|
import zh_CN from 'ant-design-vue/lib/locale-provider/zh_CN';
|
2018-03-20 11:06:04 +00:00
|
|
|
|
import 'moment/locale/zh-cn';
|
|
|
|
|
export default {
|
|
|
|
|
data() {
|
|
|
|
|
return {
|
|
|
|
|
zh_CN,
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
</script>
|
|
|
|
|
````
|
|
|
|
|
|
2018-08-04 09:52:11 +00:00
|
|
|
|
我们提供了英语,中文,俄语,法语,德语等多种语言支持,所有语言包可以在 [这里](https://github.com/vueComponent/ant-design-vue/tree/master/components/locale-provider) 找到。
|
2018-03-20 11:06:04 +00:00
|
|
|
|
|
|
|
|
|
注意:如果你需要使用 UMD 版的 dist 文件,应该引入 `antd/dist/antd-with-locales.js`,同时引入 moment 对应的 locale,然后按以下方式使用:
|
|
|
|
|
|
|
|
|
|
````html
|
|
|
|
|
<template>
|
|
|
|
|
<a-locale-provider :locale="locales.en_US">
|
|
|
|
|
<App />
|
2018-05-08 03:33:58 +00:00
|
|
|
|
</a-locale-provider>
|
2018-03-20 11:06:04 +00:00
|
|
|
|
</template>
|
|
|
|
|
<script>
|
|
|
|
|
const { LocaleProvider, locales } = window.antd;
|
|
|
|
|
</script>
|
|
|
|
|
````
|
|
|
|
|
|
|
|
|
|
### 增加语言包
|
|
|
|
|
|
2018-08-04 09:52:11 +00:00
|
|
|
|
如果你找不到你需要的语言包,欢迎你在 [英文语言包](https://github.com/vueComponent/ant-design-vue/blob/master/components/locale-provider/en_US.js) 的基础上创建一个新的语言包,并给我们 Pull Request。
|
2018-03-20 11:06:04 +00:00
|
|
|
|
|
|
|
|
|
### 其他国际化需求
|
|
|
|
|
|
|
|
|
|
本模块仅用于组件的内建文案,若有业务文案的国际化需求,建议使用 [vue-i18n](https://github.com/kazupon/vue-i18n)
|
|
|
|
|
|
|
|
|
|
## 代码演示
|