element-plus日期组件显示中文

在vite.config.js下
修改配置:
plugins: [
        vue(),
        vueJsx(),
        ElementPlus({
            i18n: {
                locale: 'zh-CN', // 设置为中文
                messages: {
                    'en': {}, // 英文消息,如果不需要其他语言,这里可以为空对象
                    'zh-CN': {
                        // 周一到周日的中文显示
                        day: {
                            'mon': '一',
                            'tue': '二',
                            'wed': '三',
                            'thu': '四',
                            'fri': '五',
                            'sat': '六',
                            'sun': '日'
                        }
                    }
                }
            }
        }),
        AutoImport({
            resolvers: [
                ElementPlusResolver()
                // 自动导入图标组件
                // IconsResolver({
                //     prefix: 'Icon'
                // })
            ]
        }),
        Components({
            resolvers: [
                // 自动注册图标组件
                IconsResolver({
                    enabledCollections: ['ep']
                }),
                ElementPlusResolver()
            ]
        }),
        Icons({
            autoInstall: true
        }),
        svgBuilder('./src/icons/svg/'),
        PluginInspect()
    ],

在所需的vue组件下引入语言包文件

import zhCn from "element-plus/es/locale/lang/zh-cn";

 将需要显示中文的组件使用el-config-provider组件包裹

<el-config-provider :locale="zhCn">
    <el-date-picker
        v-model="defaultValue"
        value-format="YYYY-MM-DD"
        placeholder="请选择日期"
        :type="optionsData!.type as DateType"
    />
</el-config-provider>

猜你喜欢

转载自blog.csdn.net/Light_10/article/details/143878406
今日推荐