vue3 页面显示中文，分页显示中文

在Vue3中使用Element Plus做分页查询，并结合axios与后端交互，通常你会创建一个组件，比如`PaginationList.vue`，其中包含分页功能和数据请求。这里是一个简单的示例： ```html <template> <el-pagination :total="total" :current-page="currentPage" @current-change="handleCurrentChange" ></el-pagination> <el-table :data="items" ... <!-- 其他table配置 --> ></el-table> </template> <script setup> import axios from &#39;axios&#39;; import { useQuery } from &#39;vue3-element-query&#39;; const [page, loading] = useQuery({ key: &#39;page&#39;, defaultProp: 1 }); // 分页处理函数 async function handleCurrentChange(pageNumber) { loading(true); try { const response = await axios.get(&#39;/api/data&#39;, { params: { page, pageSize: perPage }, // 假设perPage是每页显示的数量 }); const { data, total } = response.data; items = data; // 更新页面数据 currentPage = pageNumber; // 更新当前页数 loading(false); } catch (error) { console.error(&#39;Error fetching data:&#39;, error); loading(false); } } </script> <style scoped> /* 样式省略 */ </style> ``` 在这个例子中，后端返回的数据包括`data`部分（实际的列表数据），以及`total`（总记录数）。你可以用`response.data.total`获取到总数，然后通过一些库如`moment`、`number`转换成中文字符。 例如： ```js import numeral from &#39;numeral&#39;; // 或者其他的中文数字插件 function formatChineseNumber(num) { return numeral(num).format(&#39;0,0&#39;); } const totalInChinese = formatChineseNumber(total); // 现在totalInChinese就是中文版的总记录数了 ```