Vue 동작의 모든 예외 포착

Vue 동작의 모든 예외 포착

때때로 나는 새로운 변수의 이름을 잘못 입력한다.예외가 발생하지만 Vue 작업에서 약속의 컨텍스트에서 코드가 호출되는 경우 이 예외는 콘솔에 기록되지 않는다.

Say a Vue 동작이 예외를 발생시키는 약속을 반환함:

export const debug = ({}) => {
    return new Promise((resolve, reject) => {
        throw 'MyError';
    });
}

~할 때dispatch이러한 조치를 호출하면 예외가 침묵되고 콘솔에 로그온되지 않는다.문제를 확실히 보고하는 가장 좋은 방법은 무엇인가?

한 가지 분명한 방법은 a를 추가하는 것이다.catch한 사람 한 사람당dispatch(또는 각 액션에 대해) 오류 로깅을 처리하는 방법:

// Each action
export const debug = ({}) => {
    return new Promise((resolve, reject) => {
        throw 'MyError';
    })
    .catch(err => {
        console.error(err);
    });
}

// Each dispatch
this.$store.dispatch('debug')
.catch(err => {
    console.error(err);
});

그 해결책은 오류만 기록해도 무겁게 보인다.결국 여기서 중요한 것은 오류로부터 우아하게 복구하는 것이 아니라, Vuex 작업 컨텍스트 외부에서 호출될 경우 보고될 내용을 기록하는 것이다.

Vuex는 약속된 행동들을catch...을 배출하는vuex:error메시지(vuex 참조)store.js):

function registerAction (store, type, handler, local) {
  const entry = store._actions[type] || (store._actions[type] = [])
  entry.push(function wrappedActionHandler (payload, cb) {
    let res = handler({
      dispatch: local.dispatch,
      commit: local.commit,
      getters: local.getters,
      state: local.state,
      rootGetters: store.getters,
      rootState: store.state
    }, payload, cb)
    if (!isPromise(res)) {
      res = Promise.resolve(res)
    }
    if (store._devtoolHook) {
      return res.catch(err => {
        store._devtoolHook.emit('vuex:error', err)
        throw err
      })
    } else {
      return res
    }
  })
}

일반 핸들러는 다음과 같이 반응할 수 있다.vuex:error, 그러나 ~로서.store._devtoolHook생산에 존재하지도 않고, 그 해결책도 옳은 것 같지 않아.

Vuex 조치의 맥락에서 예외를 발생시키는 약속을 처리하는 가장 좋은 방법은 무엇인가?

참조URL: https://stackoverflow.com/questions/43149716/catch-all-exception-in-vue-action