elementui中在vue项目中调用loading页面全屏使用示例代码

以下是在 Vue 项目中使用 ElementUI 实现 Loading 全屏页面的示例代码：

首先在组件中引入 ElementUI 中的 Loading 组件：

<template>
  <div>
    <el-button @click="showLoading">点击打开 Loading</el-button>
  </div>
</template>

<script>
import { Loading } from 'element-ui';

export default {
  methods: {
    showLoading() {
      const loadingInstance = Loading.service({
        fullscreen: true,
        text: 'Loading',
        spinner: 'el-icon-loading',
        background: 'rgba(0, 0, 0, 0.7)'
      });
      setTimeout(() => {
        loadingInstance.close();
      }, 3000);
    }
  }
}
</script>

在 showLoading 方法中，通过 Loading.service 方法创建一个 Loading 实例，并传入 fullscreen: true 参数，使其全屏显示。同时可以设置 Loading 文字、Loading 图标等相关参数。最后通过 setTimeout 方法模拟 3 秒后关闭 Loading 实例。

需要注意的是，Loading 组件必须先引入 ElementUI，否则会报错。