天天看點

捕獲promise異常,不能用onerror

最近在用axios在vue裡做異步請求,遇到了難題,我在axios裡抛出異常後,想在一個地方統一捕獲異常,不想用catch方法,因為用catch的話,每個方法後面都要加,而我想要做的是把出現的異常都用彈窗的形式彈出來。

于是開始用

window.onerror = function(){}
           

但是出錯了,這個怎麼嘗試都無法捕獲promise的異常。

經過一番學習研究,找到了合适的方法,監聽unhandledrejection事件,捕獲未處理的Promise錯誤,方法如下:

window.addEventListener('unhandledrejection',function (event) {
        console.log(event.reason); // 列印抛出的異常
    })
           

果斷成功了。

下面附上一個完整的例子複制代碼即可嘗試:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>promise捕獲異常</title>
</head>
<body>
<script>
    function aaa (flag) {
        return new Promise(function (resolve, reject) {
            if (flag) {

                resolve("Hello!!!!!!");

            } else {

                reject("bye bye!!!!!!");
//                throw new Error('123')
            }
        });
    }

    aaa(false).then(function (message) {
        alert(message);
    });

    window.addEventListener('unhandledrejection',function (event) {
        console.log('捕獲異常成功了,好開心啊!!!!')
        console.log(event.reason);
    })
</script>
</body>
</html>
           

繼續閱讀