vue3 使用 Element-plus 的 el-pagination 分页组件时无法显示中文

vue3 使用 Element-plus 的 el-pagination 分页组件时无法显示中文

  • 问题

    使用element-puls 的分页组件时,显示的是英文。
    这是因为Element Plus components 默认使用英文。
    图片

  • 解决方法

    官方文档提供两种使用中文的方法:进入文档.

    • 使用全局配置项

      官方文档上的是整体加载element-plus 时使用中文的方法,下面是按需加载的代码

      // element.js
      import { ElButton, ElForm, ElFormItem } from 'element-plus'
      import lang from 'element-plus/lib/locale/lang/zh-cn'
      import { use as localeUse } from 'element-plus/lib/locale'
      
      export default (app) => {
        localeUse(lang)
      
        app.use(ElButton).use(ElForm).use(ElFormItem)
      }
      
      // main.js
      import { createApp } from 'vue'
      import App from './App.vue'
      import installElementPlus from './plugins/element'
      
      const app = createApp(App)
      installElementPlus(app)
      app.use(router).mount('#app')	
      
    • 使用 ConfigProvider 组件

      可以使用 ConfigProvider 组件包裹App 组件(这个组件也可以使用在其他单独的页面上),参考文档用法就可以

      // App.vue
      
      
      
      
      
  • 语言切换成功
    成功

你可能感兴趣的:(前端,html,vue.js,elementui,javascript)