axios渲染vue3组件表格

首先，需要在Vue3项目中安装axios和element-plus：

npm install axios
npm install element-plus

接着，在需要渲染表格的组件中引入axios和element-plus：

import axios from 'axios';
import { ElTable, ElTableColumn } from 'element-plus';

然后，在组件的data中定义表格数据：

data() {
  return {
    tableData: []
  }
}

接着，在组件的mounted钩子函数中使用axios获取数据，并将数据赋值给tableData：

mounted() {
  axios.get('/api/tableData')
    .then(response => {
      this.tableData = response.data;
    })
    .catch(error => {
      console.log(error);
    });
}

最后，在组件的template中使用ElTable和ElTableColumn渲染表格：

<template>
  <div>
    <el-table :data="tableData">
      <el-table-column prop="name" label="姓名"></el-table-column>
      <el-table-column prop="age" label="年龄"></el-table-column>
      <el-table-column prop="gender" label="性别"></el-table-column>
    </el-table>
  </div>
</template>

其中，prop属性指定表格数据中的字段名，label属性指定表格列的标题。