Tauri+Element-plus loading组件

<template>
  <el-table v-loading="data.loading" :data="data.tableData" style="width: 100%">
    <el-table-column prop="date" label="Date" width="180" />
    <el-table-column prop="name" label="Name" width="180" />
    <el-table-column prop="address" label="Address" />
  </el-table>
</template>

<script lang="ts" setup>
import { ref,reactive } from "vue";

//使用loading组件,主要是引入vLoading，而不是ElLoading。
import { ElTable, ElTableColumn, vLoading } from "element-plus";

const data = reactive({
  loading: true,
  tableData: [
    {
      date: "2016-05-02",
      name: "John Smith",
      address: "No.1518,  Jinshajiang Road, Putuo District",
    },
    {
      date: "2016-05-04",
      name: "John Smith",
      address: "No.1518,  Jinshajiang Road, Putuo District",
    },
    {
      date: "2016-05-01",
      name: "John Smith",
      address: "No.1518,  Jinshajiang Road, Putuo District",
    },
  ],
});
</script>

<style>
body {
  margin: 0;
}
.example-showcase .el-loading-mask {
  z-index: 9;
}
</style>