每次导航发生时都会执行nuxtServerInit

时间:2018-06-06 12:59:12

标签: vue.js vuex

我假设在启动时,当SSR发生时,nuxtServerInit会被调用一次。 但是我意识到每次我在webapp中导航时都会执行nuxtServerInit。

我是否误解了nuxtServerInit的使用?

~/pages

控制台日志,显示每次点击时都会调用nuxtServerInit:

  nuxt:render Rendering url /view/list +21m
axios starting
axios done
  nuxt:render Data fetching /view/list: 444ms +0ms
  nuxt:render Rendering url /view/status +10s
axios starting
axios done
  nuxt:render Data fetching /view/status: 86ms +9s
  nuxt:render Rendering url /view/list +4s
axios starting
axios done
  nuxt:render Data fetching /view/list: 98ms +4s
  nuxt:render Rendering url / +3s
axios starting
axios done
  nuxt:render Data fetching /: 106ms +3s
  nuxt:render Rendering url /view/status +4s
axios starting
axios done
  nuxt:render Data fetching /view/status: 139ms +4s

〜/商店/ index.js

import Vuex from 'vuex';

const createStore = () => {
    return new Vuex.Store({
        state: {
            myAvailableViews: [],
            isViewsInitiated: false
        },
        mutations: {
            setAvailableViews(state, views) {
                state.myAvailableViews = views;
            },
            setViewsInit(state, isInitialized) {
                state.isViewsInitiated = isInitialized;
            }
        },
        actions: {
            setAvailableViewsAction({ commit }) {
                commit('setAvailableViews', payload);
            },
            async nuxtServerInit({ commit }, { req }) {

                console.log('axios starting');
                let list = await this.$axios.get('/my/rest/api/uri');
                console.log('axios done');

            }
        },
        getters: {
            getAvailableViews(state) {
                return state.myAvailableViews;
            },
            getViewsInitiated(state) {
                return state.isViewsInitiated;
            }
        }
    });
}

export default createStore;

1 个答案:

答案 0 :(得分:2)

我实际上发了一个noob错误,使用普通的html select锚标签而不是<a>,这样页面总是完全得到服务器端渲染 一旦我执行了替换,一切正常。