vue-ele-form 组件内部默认使用中文,若希望使用其他语言,则需要进行多语言设置。以英文为例,在 main.js 中:


import Vue from 'vue'
import ElementUI from 'element-ui'
import 'element-ui/lib/theme-chalk/index.css'
import EleForm from 'vue-ele-form'
import elementLocale from 'element-ui/lib/locale/lang/en' // element-ui的语言包
import eleFormLocale from 'vue-ele-form/lib/locale/lang/en' // vue-ele-form的语言包

Vue.use(ElementUI, { elementLocale })

const eleFormGlobalOptions = {} // 全局配置,具体参见: https://www.yuque.com/chaojie-vjiel/vbwzgu/xl46cd#GIpbX
Vue.use(EleForm, eleFormGlobalOptions, eleFormLocale) // 第三个参数,将语言包传递过去



兼容 vue-i18n


import Vue from 'vue'
import Element from 'element-ui'
import 'element-ui/lib/theme-chalk/index.css'
import EleForm from 'vue-ele-form'
import VueI18n from 'vue-i18n'


// element 语言包
import elementEnLocale from 'element-ui/lib/locale/lang/en'
import elementZhLocale from 'element-ui/lib/locale/lang/zh-CN'

// vue-ele-form语言包
import eleFormEnLocal from 'vue-ele-form/lib/locale/lang/en'
import eleFormZhLocal from 'vue-ele-form/lib/locale/lang/zh-CN'
// 兼容工具
import eleFormLocale from 'vue-ele-form/lib/locale'

Vue.use(VueI18n)

const messages = {
  en: {
    message: 'hello',
    ...elementEnLocale,
    ...eleFormEnLocal // 注册语言包
  },
  zh: {
    message: '你好',
    ...elementZhLocale,
    ...eleFormZhLocal // 注册语言包
  }
}

const i18n = new VueI18n({
  locale: 'en', 
  messages,
})

// 注册element
Vue.use(Element, {
  i18n: (key, value) => i18n.t(key, value)
})
// 注册vue-ele-form
Vue.use(EleForm)

// vue-ele-form兼容处理i18n
eleFormLocale.i18n((key, value) => i18n.t(key, value))

new Vue({ i18n }).$mount('#app')


目前 vue-ele-form 内置了以下语言: