29 lines
983 B
JavaScript
29 lines
983 B
JavaScript
import { createApp } from "vue"
|
||
|
||
// 导入写好的Loading.vue文件
|
||
import Loading from "./loading.vue"
|
||
|
||
export default {
|
||
loading: null,
|
||
// 每当这个插件被添加到应用程序中时，如果它是一个对象，就会调用 install 方法。如果它是一个 function，则函数本身将被调用。在这两种情况下——它都会收到两个参数：由 Vue 的 createApp 生成的 app 对象和用户传入的选项。
|
||
install(app) {
|
||
if (this.loading) {
|
||
// 防止多次载入
|
||
app.config.globalProperties.$loading = this.loading
|
||
return
|
||
}
|
||
// 创建Loading实例，用于挂载
|
||
let instance = createApp(Loading)
|
||
// 创建div元素装载Loading对象
|
||
let div = document.createElement("div")
|
||
div.setAttribute("id","maskbox")
|
||
let body = document.body
|
||
// 导入body中
|
||
body.appendChild(div);
|
||
|
||
this.loading = instance.mount(div)
|
||
// 挂载vue身上
|
||
app.config.globalProperties.$loading = this.loading;
|
||
}
|
||
}
|