test/element
1
0
Fork 0
mirror of https://gitee.com/ElemeFE/element.git synced 2024-12-03 12:48:45 +08:00
Code Issues Actions Packages Projects Releases Wiki Activity

i18n: update doc about vue-i18n@6.x (#4471)

Browse Source 
* i18n: update doc about vue-i18n@6.x

* i18n: fix typo
This commit is contained in:
cinwell.li 2017-04-28 08:35:12 +08:00 committed by baiyaaaaa
parent f989479961
commit 2cc0fe6343
3 changed files with 79 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

42
examples/docs/en-US/i18n.md
View File

@ -37,9 +37,9 @@ webpack.config.js
}
```
## Compatible with `vue-i18n`
## Compatible with `vue-i18n@5.x`
Element is compatible with [vue-i18n](https://github.com/kazupon/vue-i18n), which makes multilingual switching even easier.
Element is compatible with [vue-i18n@5.x](https://github.com/kazupon/vue-i18n), which makes multilingual switching even easier.
```javascript
import Vue from 'vue'
@ -56,7 +56,7 @@ Vue.locale('zh-cn', zhLocale)
Vue.locale('en', enLocale)
```
## Compatibility with other i18n plugins
## Compatible with other i18n plugins
Element may not be compatible with i18n plugins other than vue-i18n, but you can customize how Element processes i18n.
```javascript
@ -72,6 +72,42 @@ Vue.use(Element, {
})
```
## Compatible with `vue-i18n@6.x`
You need to manually handle it for compatibility with `6.x`.
```javascript
import Vue from 'vue'
import Element from 'element-ui'
import VueI18n from 'vue-i18n'
import enLocale from 'element-ui/lib/locale/lang/en'
import zhLocale from 'element-ui/lib/locale/lang/zh-CN'
Vue.use(VueI18n)
const messages = {
en: {
message: 'hello',
...enLocale // Or use `Object.assign({ message: 'hello' }, enLocale)`
},
zh: {
message: '你好',
...zhLocale // Or use `Object.assign({ message: '你好' }, zhLocale)`
}
}
// Create VueI18n instance with options
const i18n = new VueI18n({
locale: 'en', // set locale
messages, // set locale messages
})
Vue.use(Element, {
i18n: key => i18n.vm._t(key)
})
new Vue({ i18n }).$mount('#app')
```
## Import via CDN
```html

42
examples/docs/zh-CN/i18n.md
View File

@ -49,9 +49,9 @@ Vue.component(Select.name, Select)
}
```
## 兼容 `vue-i18n`
## 兼容 `vue-i18n@5.x`
Element 兼容 [vue-i18n](https://github.com/kazupon/vue-i18n)，搭配使用能更方便地实现多语言切换。
Element 兼容 [vue-i18n@5.x](https://github.com/kazupon/vue-i18n)，搭配使用能更方便地实现多语言切换。
```javascript
import Vue from 'vue'
@ -69,7 +69,7 @@ Vue.locale('en', enLocale)
```
## 兼容其他 i18n 插件
如果不使用 `vue-i18n`，而是用其他的 i18n 插件，Element 将无法兼容，但是可以自定义 Element 的 i18n 的处理方法。
如果不使用 `vue-i18n@5.x`，而是用其他的 i18n 插件，Element 将无法兼容，但是可以自定义 Element 的 i18n 的处理方法。
```javascript
import Vue from 'vue'
@ -84,6 +84,42 @@ Vue.use(Element, {
})
```
## 兼容 `vue-i18n@6.x`
默认不支持 6.x 的 `vue-i18n`，你需要手动处理。
```javascript
import Vue from 'vue'
import Element from 'element-ui'
import VueI18n from 'vue-i18n'
import enLocale from 'element-ui/lib/locale/lang/en'
import zhLocale from 'element-ui/lib/locale/lang/zh-CN'
Vue.use(VueI18n)
const messages = {
en: {
message: 'hello',
...enLocale // 或者用 Object.assign({ message: 'hello' }, enLocale)
},
zh: {
message: '你好',
...zhLocale // 或者用 Object.assign({ message: '你好' }, zhLocale)
}
}
// Create VueI18n instance with options
const i18n = new VueI18n({
locale: 'en', // set locale
messages, // set locale messages
})
Vue.use(Element, {
i18n: key => i18n.vm._t(key)
})
new Vue({ i18n }).$mount('#app')
```
## 通过 CDN 的方式加载语言文件
```html

2
src/locale/index.js
View File

@ -8,7 +8,7 @@ let lang = defaultLang;
let merged = false;
let i18nHandler = function() {
const vuei18n = Object.getPrototypeOf(this || Vue).$t;
if (typeof vuei18n === 'function') {
if (typeof vuei18n === 'function' && !!Vue.locale) {
if (!merged) {
merged = true;
Vue.locale(