当前位置:   article > 正文

element-plus 将语言设置为中文_import zhcn from 'element-plus/dist/locale/zh-cn.m

import zhcn from 'element-plus/dist/locale/zh-cn.mjs

1.前提:我这里直接引入了自动安装组件的插件所以直接在app.vue中配置

2.使用:

2.1. app.vue

  1. <script setup lang="ts">
  2. import zhCn from 'element-plus/dist/locale/zh-cn.mjs'
  3. const locale = zhCn
  4. const value1 = ref('')
  5. </script>
  6. <template>
  7. <el-config-provider :locale="locale">
  8. <el-date-picker v-model="value1" type="date" placeholder="Pick a day" :size="size" />
  9. </el-config-provider>
  10. </template>

2.2如果是Ts项目,ts会报element-plus/dist/locale/zh-cn.mjs没有声明,需要在根目录的env.d.ts文件进行声明。

  1. /// <reference types="vite/client" />
  2. declare module '*.vue' {
  3. import { DefineComponent } from 'vue'
  4. // eslint-disable-next-line @typescript-eslint/no-explicit-any, @typescript-eslint/ban-types
  5. const component: DefineComponent<{}, {}, any>
  6. export default component
  7. }
  8. declare module 'element-plus/dist/locale/zh-cn.mjs' //加上这段代码即可
  9. // 环境变量 TypeScript的智能提示
  10. interface ImportMetaEnv {
  11. VITE_APP_TITLE: string
  12. VITE_APP_PORT: string
  13. VITE_APP_BASE_API: string
  14. }
  15. interface ImportMeta {
  16. readonly env: ImportMetaEnv
  17. }

3.效果图

声明:本文内容由网友自发贡献,不代表【wpsshop博客】立场,版权归原作者所有,本站不承担相应法律责任。如您发现有侵权的内容,请联系我们。转载请注明出处:https://www.wpsshop.cn/w/我家小花儿/article/detail/119115
推荐阅读
相关标签
  

闽ICP备14008679号