Element-plus中使用pagination显示sizes为中文

需求描述

使用分页组件中添加sizes信息,也就是一个下拉框,用户可以选择当前页的数据量

<el-pagination background v-model:current-page="currentPage" v-model:page-size="pageSize" :total="total"
      :page-sizes="[5, 10, 15, 20, 25]" @current-change="handleCurrentChange" @size-change="handleSizeChange"
      layout="sizes, prev, pager, next" :hide-on-single-page="false" />

但是在显示时却是英文 也就是这样的
image
后来查询发现,element-plus默认就是英文的,需要我们将其改成中文的即可

解决方案

再App.vue中引入local

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

<script lang="ts" setup>
import locale from "element-plus/lib/locale/lang/zh-cn"
</script>

之后就变成中文的
image

posted @ 2023-05-13 13:15  含若飞  阅读(575)  评论(0编辑  收藏  举报