Question

在某些时候开发我错误输入新变量的名称。抛出异常，但如果在Vue操作中的Promise上下文中调用代码，则不会在控制台上记录此异常。

假设一个Vue动作返回一个抛出异常的Promise：

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

当dispatch调用该操作时，异常将被静音并且永远不会在控制台上记录。确保报告问题的最佳方法是什么？

一种显而易见的方法是为每个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操作环境中抛出异常的Promise的最佳方法是什么？

在Vue操作中捕获所有异常

0 个答案: