element-plus官方文档:https://element-plus.gitee.io/zh-CN/guide/i18n.

我项目中使用element-plus 和vue的版本如下:

"element-plus": "^1.3.0-beta.1", "vue": "^3.0.0",

根据官方文档提供的方式,我未能成功修改默认的英文组件为中文:

官网截图:

截图中的代码:

import ElementPlus from 'element-plus'
import zhCn from 'element-plus/es/locale/lang/zh-cn'

app.use(ElementPlus, {
  locale: zhCn,
})

于是,我采用了下面的方法,就成功把新版的element-plus默认的英文组件修改为中文了。

//在vue项目得App.vue中添加以下代码

<template>
  <el-config-provider :locale="locale">
    <slot name="app"></slot>
  </el-config-provider>
</template>
<script>
import { ElConfigProvider } from 'element-plus'
import zhCn from 'element-plus/lib/locale/lang/zh-cn'
export default {
  name: 'ZhProvider',
  components: {
    [ElConfigProvider.name]: ElConfigProvider
  },
  setup() {
    let locale = zhCn
    return {
      locale
    }
  }
}
</script>
<style scoped lang='scss'>
</style>

最后,感谢可乐攻城狮的分享,下面这篇文章写得更好更详细,可前往阅读!vue3.0中使用Element-plus默认英文组件修改为中文_一个超爱喝可乐的web前端攻城狮-CSDN博客_element plus 中文

Logo

前往低代码交流专区

更多推荐