Nuxt.js：从vuex开始加载指标

Question

根据文档，有一种方法可以手动启动组件中的nuxt加载指示器，例如：

export default {
    methods: {
        startLoading() {
            this.$root.$loading.start();
        },
    },
}

是否可以通过vuex动作切换加载程序？如何通过vuex操作访问$root对象？

Answer 1

甜！显然，可以通过客户端上可用的window属性来访问它。建议通过检查process.browser来确认该操作是在客户端而不是服务器上运行的：

export const actions = {
    startLoading({ commit }) {
        if (process.browser) {
            window.$nuxt.$root.$loading.start();
        }
        commit('SET_LOADING', true);
    },
    finishLoading({ commit }) {
        if (process.browser) {
            window.$nuxt.$root.$loading.finish();
        }
        commit('SET_LOADING', false);
    },
}

非常酷。这些动作是从axios拦截器调用的，因此现在它指示在向服务器发出任何请求时全局加载。