今天在 vue3 的项目中使用到了 element-ui-plus，在调用组件的时候发现渲染出来的默认都是英文版，对于我来说主要还是中文为主（还是因为英语太烂了。

方法 1： 全局引入

在main.js文件：

1
2
3
4
5
6
//怎么按需修改中文
import ElementPlus from 'element-plus';
import locale from 'element-plus/lib/locale/lang/zh-cn'; //需要新加的代码

const app = createApp(App);
app.use(ElementPlus, { locale }); //需要改变的地方，加入locale

方法 2：按需引入

在某个组件中修改

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
<template>
	<el-pagination
		:locale="locale"
		background
		@size-change="handleSizeChange"
		@current-change="handleCurrentChange"
		:current-page="currentPage4"
		:page-sizes="[20, 50, 100, 200]"
		:page-size="20"
		layout="->,total, sizes, prev, pager, next, jumper"
		:total="total">
	</el-pagination>
</template>

<script setup>
	import { ElConfigProvider } from 'element-plus';
	import zhCn from 'element-plus/lib/locale/lang/zh-cn';

	const { locale } = reactive({
		locale: zhCn,
	});
</script>