Element-Plus中日期时间选择器组件DateTimePicker默认显示英文的问题

柔光的暖阳◎ 2023-09-30 07:57 9阅读 0赞

**因为Element-Plus框架默认显示的是英文版，需要修改语言配置**

![watermark_type_ZHJvaWRzYW5zZmFsbGJhY2s_shadow_50_text_Q1NETiBA55-i6L2m6I-KXw_size_20_color_FFFFFF_t_70_g_se_x_16][]

**接下来是效果图**

![watermark_type_ZHJvaWRzYW5zZmFsbGJhY2s_shadow_50_text_Q1NETiBA55-i6L2m6I-KXw_size_20_color_FFFFFF_t_70_g_se_x_16 1][]

**配置在src文件夹下的main.js文件**

import { createApp } from "vue";
    import App from "./App.vue";
    
    import ElementPlus from "element-plus";
    import "element-plus/dist/index.css";
    
    import 'dayjs/locale/zh-cn';
    import locale from "element-plus/lib/locale/lang/zh-cn";
    
    createApp(App).use(ElementPlus, { locale }).mount("#app");

**接下来的一步非常重要！！！！！！！！！！！！**

**![0894c360aa82478c978cab5c968cb858.png][]**

**这个引入的名字千万千万要是 locale，因为差一个字母就没有中文效果，也是困扰了题主好几个小时没想明白 可能因为功力不够**

[watermark_type_ZHJvaWRzYW5zZmFsbGJhY2s_shadow_50_text_Q1NETiBA55-i6L2m6I-KXw_size_20_color_FFFFFF_t_70_g_se_x_16]: https://img-blog.csdnimg.cn/6712080221834b6ba39dd719bda57b30.png?x-oss-process=image/watermark,type_ZHJvaWRzYW5zZmFsbGJhY2s,shadow_50,text_Q1NETiBA55-i6L2m6I-KXw==,size_20,color_FFFFFF,t_70,g_se,x_16
[watermark_type_ZHJvaWRzYW5zZmFsbGJhY2s_shadow_50_text_Q1NETiBA55-i6L2m6I-KXw_size_20_color_FFFFFF_t_70_g_se_x_16 1]: https://img-blog.csdnimg.cn/81963dc52acd46c3bebb979a01f80fe4.png?x-oss-process=image/watermark,type_ZHJvaWRzYW5zZmFsbGJhY2s,shadow_50,text_Q1NETiBA55-i6L2m6I-KXw==,size_20,color_FFFFFF,t_70,g_se,x_16
[0894c360aa82478c978cab5c968cb858.png]: https://img-blog.csdnimg.cn/0894c360aa82478c978cab5c968cb858.png