programing

nuxtServerInit은 네비게이션이 발생할 때마다 실행됩니다.

procenter 2023. 1. 3. 22:39
반응형

nuxtServerInit은 네비게이션이 발생할 때마다 실행됩니다.

nuxtServerInit은 SSR가 발생했을 때 부팅 시 한 번 호출되는 것으로 가정했습니다.하지만 웹앱을 탐색할 때마다 nuxtServerInit이 실행된다는 것을 깨달았습니다.

nuxtServerInit 사용을 잘못 알고 있습니까?

~ / 페이지

콘솔 로그: 클릭할 때마다 nuxtServerInit이 호출됨을 나타냅니다.

nuxt: 렌더 렌더링 URL /view/list +21m악리 시작악리가 행해졌다nuxt: 렌더 데이터 가져오기 /view/list: 444ms +0msnuxt: 렌더 렌더링url / view / status + 10s악리 시작악리가 행해졌다nuxt: 렌더 데이터 가져오기 /view/status: 86ms +9snuxt: 렌더 렌더링 URL /view/list +4s악리 시작악리가 행해졌다nuxt: 렌더 데이터 가져오기 /view/list: 98ms + 4snuxt: 렌더 렌더링 URL / +3s악리 시작악리가 행해졌다nuxt: 렌더 데이터 가져오기 /: 106ms + 3snuxt: 렌더 렌더링url / view / status + 4s악리 시작악리가 행해졌다nuxt: 렌더 데이터 가져오기 /view/status: 139ms + 4s

~/store/index.devel

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;

실제로 일반 html을 사용하여 noob 오류를 범했습니다.<a>대신 앵커 태그<nuxt-link>이렇게 하면 페이지는 항상 서버 측에서 완전히 렌더링됩니다.교체를 실행하면 모든 것이 올바르게 동작합니다.

언급URL : https://stackoverflow.com/questions/50721052/nuxtserverinit-is-being-executed-everytime-navigation-happens

반응형