Vue.js：在vuex行动中未被捕获的承诺-Java 学习之路

我理解vuex动作返回承诺，但我没有在vuex中找到 ideal pattern to handle errors . 我目前的方法是在我的axios插件上使用错误拦截器，然后将错误提交到我的vuex商店 .

在 plugins/axios.js ：

export default function({ $axios, store }) {
    $axios.onError(error => {
        store.dispatch('setError', error.response.data.code);
    });
}

在 store/index.js ：

export const state = () => ({
    error: null,
});

export const mutations = {
    SET_ERROR(state, payload) {
        state.error = payload;
    },
}

export const actions = {
    setError({ commit }, payload) {
        commit('SET_ERROR', payload);
    },
};

然后我会使用 error component 观察错误状态并显示是否有错误 . 因此，在我的操作或调度操作的组件中确实存在 no need to catch any errors . 但是我可以't help to worry if it' s bad design leaving exceptions uncaught ？如果我通过这种设计处理错误，我会遇到什么问题？有关更好的方法的建议吗？

1 回答

我认为你应该在vuex动作中进行api调用，如果失败则拒绝来自api调用的错误的promise . 我会避免列出所有axios错误，而是在promise中返回它时处理错误，在我看来这样更容易维护和调试
vuex usage

例如：

getCartItems: function ({commit}, url) {
      return new Promise((resolve, reject) => {
            axios.get(url).then(response => {
              commit('setCartItems', response.data)
              resolve(response)
            }).catch(error => {
              reject(error)
            })
      })
 },

回复于 2024-05-05T08:50:30+08:00

Vue.js：在vuex行动中未被捕获的承诺

1 回答

相关问题