Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

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

Merged
merged 2 commits into from
Apr 28, 2017
Merged

Conversation

QingWei-Li
Copy link
Contributor

Please makes sure these boxes are checked before submitting your PR, thank you!

  • Make sure you follow Element's contributing guide (中文 | English).
  • Make sure you are merging your commits to dev branch.
  • Add some descriptions and refer relative issues for you PR.

@@ -72,6 +72,42 @@ Vue.use(Element, {
})
```

## Compatibility `vue-i18n@6.x`
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

和上面保持一致吧,Compatible with

@BelinChung
Copy link

How do I configure eui components language when I importing Element on demand and vue-i18n@6.x. It doesn't seem to mention in the document?
当我使用 vue-i18n@6.x, 我该如何配置按需引用的 eui 组件的国际化语言,它好像没有在文档中提及?

@QingWei-Li
Copy link
Contributor Author

@BelinChung

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'
import App from './App.vue'

import localeProvider from 'element-ui/lib/locale'

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
})

localeProvider.i18n(key => i18n.t(key))
Vue.use(Element.DatePicker)

new Vue({ i18n, render: h => h(App) }).$mount('#app')

@BelinChung
Copy link

@QingWei-Li 谢谢!

@panicake
Copy link

panicake commented May 2, 2017

import Vue from 'vue';
import ElementUI from 'element-ui';
// ele语言包
import enLocale from 'element-ui/lib/locale/lang/en';
import zhLocale from 'element-ui/lib/locale/lang/zh-CN';
// 自定义语言包
import en from './local/lang/en';
import zhCN from './local/lang/zh-CN';

import format from 'element-ui/lib/locale/format';
const formater = format(Vue);
// 设置语言
Vue.use(VueI18n);
// 语言包
const messages = {
  en: {
    ...en,
    ...enLocale
  },
  zhCN: {
    ...zhCN,
    ...zhLocale
  }
};
// vue-i18n
const i18n = new VueI18n({
  locale: 'zhCN', // set locale
  messages, // set locale messages
});
// 初始化ElementUI语言包
Vue.use(ElementUI, {
  i18n(path, options) {
    let value = i18n.t(path);
    if (value !== null && value !== undefined) return formater(value, options);
    const array = path.split('.');
    for (let i = 0, j = array.length; i < j; i += 1) {
      const property = array[i];
      value = i18n.t(property);
      if (i === j - 1) return formater(value, options);
      if (!value) return '';
    }
    return '';
  }
});
new Vue({ i18n, render: h => h(App) }).$mount('#app')

这里必须需要进行format处理吧,有的key是el.total.pagination: 'Total {total}', {total}需要替换!

bluejfox added a commit to setariajs/setaria-ui that referenced this pull request May 25, 2017
* commit '3c590edbab561819ec78b842d38ddf9a27cd733f': (35 commits)
  [release] 1.3.0-beta.1
  [build] 1.3.0-beta.1
  update docs vue version
  Changelog: update for 1.3.0-beta.1
  Transfer (ElemeFE#4337)
  Table: add summary row, fixed ElemeFE#1307, fixed ElemeFE#4451 (ElemeFE#4484)
  Update date.vue
  Update date.vue
  DatePicker: 当format不包括秒时,时间下拉菜单不展示ss
  update dependencies
  Radio: fix radio-button style when nested in a form-item
  DatePicker: make type responsive(ElemeFE#4417)
  Transition: update docs
  doc: add DatePicker default-value
  DatePicker: supports default value
  i18n: update doc about vue-i18n@6.x (ElemeFE#4471)
  support use transitiongroup in el-col (ElemeFE#4483)
  Switch:feat support number value
  Switch: feature add-expand-value
  fix upload can't select the same file
  ...

# Conflicts:
#	CHANGELOG.zh-CN.md
#	README.md
#	build/bin/version.js
#	build/deploy-ci.sh
#	examples/docs/zh-CN/dialog.md
#	examples/docs/zh-CN/upload.md
#	examples/versions.json
#	package.json
#	packages/date-picker/src/basic/time-spinner.vue
#	packages/date-picker/src/panel/date.vue
#	packages/dialog/src/component.vue
#	packages/upload/src/index.vue
#	packages/upload/src/upload.vue
#	src/index.js
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

5 participants