SSR Hydrate 관련 질문입니다.

Question

getServerSideProps를 실행 후 HYDRATE가 발생되면 초기 state로 초기화가 됩니다. 어디가 잘못 된 것 일까요? /pages/index.js  export const getServerSideProps = wrapper . getServerSideProps ( async (context) => { const cookie = context . req ? context . req . headers . cookie : '' ; axios . defaults . headers . Cookie = '' ; if (context . req && cookie) { axios . defaults . headers . Cookie = cookie; } context . store . dispatch ({ type : LOAD_MY_INFO_REQUEST , }); context . store . dispatch ( END ); await context . store . sagaTask . toPromise (); }); /reducers/index.js // (이전상태, 액션) => 다음상태 const rootReducer = (state, action) => { switch (action . type ) { case HYDRATE : console.log ( 'HYDRATE' , action . payload ); return action . payload ; default : { const combineReducer = combineReducers ({ user , }); return combineReducer (state, action); } } }; 페이지 이동시 메뉴 state가 변경 됨. (state이름 : currentMenu) 페이지가 이동해서 hydrate가 실행되면 이전 메뉴state로 초기화가됨

제로초(조현영) · Answer

네, 새 페이지를 로딩한 것이라 기존 스테이트가 초기화됩니다. 이를 막으려면 바뀐 메뉴조차도 서버사이드렌더링을 해야 합니다.