element-ui封装loading,便于在拦截请求或其他场景使用

loading.js

import {
    
     Loading } from 'element-ui'

let loadingCount = 0
let loading

const startLoading = () => {
    
    
    loading = Loading.service({
    
    
        lock: true,
        text: '加载中',
        background: 'rgba(0, 0, 0, 0.7)'
    })
}

const endLoading = () => {
    
    
    loading.close()
}

export const showLoading = () => {
    
    
    if (loadingCount === 0) {
    
    
        startLoading()
    }
    loadingCount += 1
}

export const hideLoading = () => {
    
    
    if (loadingCount <= 0) {
    
    
        return
    }
    loadingCount -= 1
    if (loadingCount === 0) {
    
    
        endLoading()
    }
}

使用

import {
    
     showLoading, hideLoading } from '@/utils/loading'

showLoading()
hideLoading()

猜你喜欢

转载自blog.csdn.net/weixin_46099269/article/details/133991348