×

vue3小应用:elementPlus全局组件中文转换方式

作者:Terry2023.02.04来源:Web前端之家浏览:809评论:0
关键词:vue3

vue3小应用:elementPlus全局组件中文转换方式。

在项目中使用日期下拉框发现是英文的,需要全局改成中文样式。

代码实现

在 App.vue 的文件中修改即可。

代码如下

<template>
    <el-config-provider :locale="locale">
      <router-view></router-view>
    </el-config-provider>
</template>
<script lang="ts" setup>
    import { ElConfigProvider } from 'element-plus'
    import zhCn from 'element-plus/lib/locale/lang/zh-cn';
     
    const { locale } = reactive({
      locale: zhCn,
    });
     
</script>

参考官方链接:https://element-plus.org/en-US/guide/i18n.html#configprovider

elementPlus 设置默认语言为中文

Element UI的默认语言是英文。那么如何才能将其改成中文呢?

ElementUI 提供了国际化的支持,这里给出其中的一个改成中文的方法。

找到main.js 文件, 做如下改动:

import {createApp} from 'vue'
import ElementPlus from 'element-plus';
import locale from "element-plus/lib/locale/lang/zh-cn";//需要新加的代码
import App from './App.vue'
import "element-plus/lib/theme-chalk/index.css";
 
let app = createApp(App);
app.use(ElementPlus, {locale});//需要改变的地方,加入locale
app.mount('#app');


您的支持是我们创作的动力!
温馨提示:本文作者系Terry ,经Web前端之家编辑修改或补充,转载请注明出处和本文链接:
https://www.jiangweishan.com/article/vuejs20230204a1.html

网友评论文明上网理性发言 已有0人参与

发表评论:

最新留言

  • 访客

    啊...

  • jimmy

    SEO更多跟代码有关。...

  • jianj

    node看上有点复杂...

  • 访客

    正好遇到,谢谢分享...

  • jimmy

    这个很有趣,国内SEO更多的是百度...

  • jenny

    VUE的总结的不错啊,收藏了。下次搞点React的啊...

  • jenny

    win7最经典,想当初win8出来后都没它好用,怀恋经典。。。...

  • Terry

    谢谢提醒,插件已经修复。...

首页|JavaScript|HTML|HTML4|HTML5|CSS3|开发工具|性能优化|移动开发|前端教程|性能优化|开发工具|酷站欣赏|UI设计|前端教程

Copyright © 2023 Web前端之家(www.jiangweishan.com) 版权所有 All Rights Reserved.
粤ICP备12067512号-1

Copyright Your WebSite.Some Rights Reserved.

Powered By Z-BlogPHP 1.7.2