element-plus vue3.0按需引入设置默认中文

App.vue相关技术探讨

原创已于 2022-10-27 01:24:18 修改 · 1.2k 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#vue.js #javascript #elementui

于 2022-10-27 01:23:07 首次发布

博客围绕App.vue展开，涉及Vue.js、JavaScript和Element UI等信息技术。这些技术在前端开发中应用广泛，能助力构建高效、美观的用户界面。

App.vue：

<template>
  <el-config-provider :locale="locale">
    <router-view />
  </el-config-provider>
</template>

<script lang="ts">
import { Options, Vue } from "vue-class-component";
import { ElConfigProvider } from "element-plus";
import zhCn from "element-plus/lib/locale/lang/zh-cn"; //国际化(中文)

@Options({
  components: {
    ElConfigProvider
  }
})
export default class MyComponent extends Vue {
  locale = zhCn;
}
</script>

<style lang="scss">
html,
body {
  margin: 0;
  padding: 0;
  width: 100vw;
  height: 100vh;
}

body {
  background-size: cover;
  background-position: center;
  background-color: #f5f5fb;
  -webkit-font-smoothing: antialiased;
  font-family: "PingFang SC";
  font-weight: bold;
  color: #452020;
}
</style>