elementUI loading提示使用

// 匯入Loading 
import { Loading } from 'element-ui';

/** 
 * get方法，對應get請求 
 * @param {String} url [請求的url地址] 
 * @param {Object} params [請求時攜帶的引數] 
 */
export function get(url, params) {
    let loadingInstance = Loading.service(
        {background: 'rgba(0, 0, 0, 0.7)', 
            text:'載入中', spinner: 'el-icon-loading'});
    return new Promise((resolve, reject) => {
        axios.get(url, {
            params: params
        })
        .then(res => {
            resolve(res.data);
            loadingInstance.close()
        })
        .catch(err => {
            reject(err.data)
            loadingInstance.close()
        })
    });
}

新增在了axios封裝的get和post請求中了，這樣每次請求都會彈出載入介面，請求完都會消失。

 

如果和其他彈出框 比如 Dialog 衝突，那麼可以調 Dialog zIndex 低於 2000, loading就會在上面 

<el-dialog title="新增使用者" :visible.sync="dialogFormVisible" width="30%" center zIndex=1999>