解决element-plus 组件国际化无法显示中文问题

element-plus 组件国际化

按照官方文档的只要在
main.js里面引入就好，但是我引入根本没法解决问题

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

createApp(App).use(store).use(router).use(ElementPlus).use(ElementPlus, {locale}).mount('#app')

还是显示英文

解决

通过 ConfigProvider 的方式来使用。
在App.vue中使用el.config.provider包裹组件

<template>
  <el-config-provider :locale="locale">

<div>
<!--头部-->
  <Header/>

<!--  主体-->
  <div style="display: flex">

<!--    侧边栏-->
    <Aside/>
<!--    内容区域-->
    <router-view style="flex: 1"/>
  </div>
</div>

  </el-config-provider>
</template>

<script>
import Header from "@/components/Header";
import Aside from "@/components/Aside";
import { ElConfigProvider } from 'element-plus'
import zhCn from 'element-plus/lib/locale/lang/zh-cn'

export default {
  name : "layout",
  components : {
    Aside,
    Header,
    [ElConfigProvider.name]: ElConfigProvider,
  },
  data() {
    return {
      locale: zhCn,
    }
  },
}
</script>

加入之后完美解决：