Vue에서 글로벌 오류 처리를 구현하는 방법

Vue에서 글로벌 오류 처리를 구현하는 방법

나는 Vue에서 글로벌 에러 처리를 하고 싶다.JS, 각도 2+의 오류 처리 시스템처럼.나는 많은 노력을 했지만 이 핸들링을 실행할 좋은 방법을 찾을 수 없었다.

당신이 많은 서비스 방법을 가지고 있고, 이러한 방법들이 차례로 실행되어야 한다고 상상해보아라. 그래서 그 때 글을 쓰고 프리보우스 서비스 안에서 캐치 방법을 쓰는 것은 매우 추악하고 부정하며, 지금 나는 그러한 방법을 구현하기 위한 깨끗한 방법을 찾고 있다.내 말뜻을 이해해주길 바란다.

@Badgy가 언급한 대로 Vue 오류 처리기를 설치하여 Vue가 마주치는 오류를 포착할 수 있다.이는 다음과 같이 할 수 있다.

 Vue.config.errorHandler = function (err, vm, info) {
   // handle error
   // `info` is a Vue-specific error info, e.g. which lifecycle hook
   // the error was found in. Only available in 2.2.0+
 }

위의 코드는 Javascript에서 당신이 원하는 어느 곳에나 위치할 수 있다.vue 인스턴스를 만들기 직전에 코드를 찾음. 즉, vue 인스턴스를 만들기 전에 코드를 찾음 var app = new Vue({...});코드. 글로벌 vue 오류 처리기 때문에 vue 구성 요소뿐만 아니라 모든 vue 인스턴스의 오류를 처리한다.나는 실제로 그것이 대부분 vue 렌더링 방법에서 발생하는 오류를 포착한다는 것을 발견했다.

자세한 내용은 https://vuejs.org/v2/api/#errorHandler를 참조하십시오.

보다 일반적인(vue 관련되지 않은) javascript 오류의 경우 다음과 같은 글로벌 오류 처리기가 여전히 필요함:

 window.onerror = function (msg, url, line, col, error) {
     //code to handle or report error goes here
 }

다시 말하지만, 이 코드는 javascript가 허용된 모든 곳에 배치될 수 있지만, 일반적으로 당신은 당신의 javascript 스택에서 일찍 실행되도록 그것을 배치하기를 원할 것이다.자세한 내용은 https://developer.mozilla.org/en-US/docs/Web/API/GlobalEventHandlers/onerror를 참조하십시오.

그리고 마지막으로 '약속 거부'(즉, 약속 기능에서 예외적으로 던지는 것)를 잡기 위해서는 약속 거부가 당사자에게 잡히지 않기 때문에 이벤트를 경청할 필요가 있다.window.onerror(끝에 @Blauhirn 덕택)일부 브라우저(Chrome 및 Edge 현재)에서는 다음과 같은 접근 방식으로 약속 거부를 포착할 수 있다.

 window.addEventListener('unhandledrejection', function(event) {
     //handle error here
     //event.promise contains the promise object
     //event.reason contains the reason for the rejection
 });

자세한 내용은 StackOverflow 질문: 처리되지 않은 모든 Javascript 약속 거부 확인

나는 내가 너의 질문을 옳게 이해했으면 좋겠지만, 이것이 네가 찾고 있는 것일 수도 있어.

오류캡처됨

유형: (err: 오류, vm: 구성 요소, 정보: 문자열) => ?부울

세부 정보: 모든 하위 구성 요소에서 오류가 캡처되면 호출됨.후크는 오류, 오류를 트리거한 구성 요소 인스턴스, 오류가 캡처된 위치에 대한 정보를 포함하는 문자열의 세 가지 인수를 수신한다.고리가 거짓으로 돌아와 오류가 더 이상 전파되지 않도록 할 수 있다.

여기에 그것에 대한 더 자세한 정보가 있다.Vue 2.5.0+에 주의하십시오.

참조URL: https://stackoverflow.com/questions/52071212/how-to-implement-global-error-handling-in-vue