template.tsx 에서 서버 fetch 후 클라이언트 컴포넌트로 넘겨주면 싱크가 맞는 이유
아래 코드와 같이 template.tsx에서 서버fetch 후 사용처인 클라이언트 컴포넌트로 props 넘겨주도록 세팅해놓았습니다.
//template.tsx 자식 컴포넌트
export default async function Sidebar() {
const { isSucceed, body } = await getUserGetInfo(params);
return (
<SidebarLayout>
<GiftIcon isNewGift={!!body?.info.new_gift} />
'use client'
export default function GiftIcon({ isNewGift }: { isNewGift: boolean }) {
const { onClose } = useModal('SIDEBAR');
return (
<Link
className={isNewGift ? cn(st['active']) : ''}
///
<Icon type="Present" title="선물함" w={25} h={25} />
이 상태에서 next 페이지 이동 시 서버fetch는 리렌더링 되는것을 확인했는데
이상하게 클라이언트는 리렌더링이 되지 않습니다. 즉 서버 응답값은 상태가 바뀌어도 클라이언트 상태값은 바뀌지 않더라구요... 왜 이런걸까요ㅠㅠㅠ
답변 1
0
이런 경우 문제 원인이 다양할 수 있어서요.
혹시 클라이언트 라우팅이 route segment 는 그대로이고, searchParams 가 바뀌는 형식일까요?
(예를 들어 /gift-item -> /gift-list 의 이동이 아닌, /gift-item?id=1 -> /gift-item?id=2 처럼요)
만약 위와 같은 이동(searchParams 만 바뀜)이라면 template.tsx 도 리렌더링이 발생하지 않아서 여쭤봅니다 🙏
노션 열기에 도움이 필요합니다.
0
5
1
노션 파일 권한
0
15
2
좋은 강의 자료 감사합니다.
0
17
2
PRD 생성 서브에이전트
0
12
1
유튜브 영상보고 강의 등록하였습니다.
0
18
2
클로드 코드 토큰 절약 공식 플러그인 4개
0
13
0
template 동작 흐름에 대해서 질문 있습니다.
1
71
1
Link 컴포넌트는 그러면 웬만하면 무조건 쓰는편이 좋은가요?
0
83
2
middleware.ts가 proxy.ts로 변경되고 실행 시점도 바뀌었다네요
1
247
2
PPR을 보고 오라고 하시는데
1
83
2
useInfiniteQuery promise와 react use 사용시 페이지 무한 로딩
0
59
1
강의에 언급된 영상 질문
0
71
2
next Request Memoization과 react cache
0
80
1
next.js 서버fetch 에러 fallback ui 구현 방법
0
197
2
필터옵션이 많은 페이지에서도 서버 fetch를 사용하는게 맞을까요??
0
88
2
서버 fetch suspense 로 감싸고 새로고침 시 잠시 빈 화면이 노출된 후 fallback ui가 노출됩니다.
0
82
1
layout 컴포넌트 내 클라이언트 컴포넌트
0
84
2
게시판 리스트 작성할 때 use client를 어디서부터 붙여야할지 모르겠어요
0
91
1
'왜 Next.js 가 필요할까?(기술적인 등장 배경)' 에서 언급하는 영상들이 무엇일까요?
0
149
2
Parallel Route를 사용한 모달에 대해 질문이 있어요.
0
113
2
유튜브 영상과의 차이점 문의
0
236
1
template.tsx 가 SEO 에 주는 이점에 대한 질문
0
105
2
자동화 스크립트 관련하여 질문있습니다.
0
109
2
색션1 예제 코드 질문드립니다.
0
211
1