Vue使用element组件el-upload手写axios上传图片到后端java接口，数据用Formdata传递。

在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 'axios'; import { useQuery } from 'vue3-element-query'; const [page, loading] = useQuery({ key: 'page', defaultProp: 1 }); // 分页处理函数 async function handleCurrentChange(pageNumber) { loading(true); try { const response = await axios.get('/api/data', { params: { page, pageSize: perPage }, // 假设perPage是每页显示的数量 }); const { data, total } = response.data; items = data; // 更新页面数据 currentPage = pageNumber; // 更新当前页数 loading(false); } catch (error) { console.error('Error fetching data:', error); loading(false); } } </script> <style scoped> /* 样式省略 */ </style> ``` 在这个例子中，后端返回的数据包括`data`部分（实际的列表数据），以及`total`（总记录数）。你可以用`response.data.total`获取到总数，然后通过一些库如`moment`、`number`转换成中文字符。 例如： ```js import numeral from 'numeral'; // 或者其他的中文数字插件 function formatChineseNumber(num) { return numeral(num).format('0,0'); } const totalInChinese = formatChineseNumber(total); // 现在totalInChinese就是中文版的总记录数了 ```