main.js
import { createApp } from 'vue'
import App from './App.vue'
import './registerServiceWorker'
import router from './router'
import store from './store'
import ElementPlus,{ElLoading} from 'element-plus'
import 'element-plus/dist/index.css'
const app = createApp(App)
app.use(store).use(router).use(ElementPlus).mount('#app')
app.config.globalProperties.$ElLoading=ElLoading
window.ElLoading=ElLoading//也可以挂到window对象里面
app.vue
<template>
<el-button type="primary" @click="overall"> As a service </el-button>
</template>
<script setup>
import { getCurrentInstance } from 'vue';//因为vue3是组合API,所以要引入对应的(getCurrentInstance)
const {proxy} = getCurrentInstance()
const openFullScreen2 = () => {
//const loading = window.ElLoading.service({
const loading = proxy.$ElLoading.service({
lock: false,
text: 'Loading',
background: 'rgba(0, 0, 0, 0.7)',
})
setTimeout(() => {
loading.close()
}, 1000)
}
</script>