Vue 구성 요소 오류에 대한 통합 모니터링

하나, window.onerror

  • 모든 JS 오류 보고서를 전역적으로 모니터링
  • 하지만 JS 수준이므로 Vue 구성 요소 정보를 인식할 수 없습니다.
  • Vue가 수신할 수 없는 일부 오류 캡처

여기에 이미지 설명을 삽입하세요.

여기에 이미지 설명을 삽입하세요.
이렇게도 쓸 수 있어요
여기에 이미지 설명을 삽입하세요.

window.onerror
그러나 try...catch...를 사용하여 오류를 캡처한 경우 window.onerror로는 캡처할 수 없습니다.
여기에 이미지 설명을 삽입하세요.

2. 오류캡처된 수명주기

  • 모든 하위 구성 요소 의 오류를 수신합니다.
  • false를 반환하면 상향 전파가 방지됩니다
    여기에 이미지 설명을 삽입하세요.
    . window.onerror도 모니터링됩니다(상향 전파가 있음).
    여기에 이미지 설명을 삽입하세요.
    false를 반환하면 상향 전파가 방지됩니다.(반복 캡처 방지)
    여기에 이미지 설명을 삽입하세요.
    여기에 이미지 설명을 삽입하세요.

3. errorHandler 구성

  • Vue 전역 오류 모니터링, 모든 구성 요소 오류가 여기에 요약됩니다.
  • 그러나 errorCaptured는 false를 반환하고 여기에 전파되지 않습니다.

여기에 이미지 설명을 삽입하세요.
여기에 이미지 설명을 삽입하세요.
false를 반환하지 않으며 window.onerror가 실행되지 않습니다. errorHandler는 이미 전역 모니터입니다
. window.onerror와 errorHandler는 상호 배타적입니다.

비동기 오류

  • 비동기 콜백의 오류는 errorHandler로 모니터링할 수 없습니다.
  • window.onerror를 사용해야 합니다.

여기에 이미지 설명을 삽입하세요.
여기에 이미지 설명을 삽입하세요.
window.onerror만 오류를 모니터링합니다.

요약하다

  • errorCaptured는 하위 구성 요소의 오류를 모니터링하고 상향 전파를 방지하기 위해 false를 반환합니다.
  • errorHandler는 전역 Vue 구성 요소의 오류를 수신합니다.
  • window.onerror는 비동기와 같은 기타 JS 오류를 모니터링합니다.
    여기에 이미지 설명을 삽입하세요.

추천

출처blog.csdn.net/weixin_44582045/article/details/133206006