<p>새로운 애플리케이션 디렉토리와 jotai를 전역 상태 관리자로 사용하여 Next.js 13 프로젝트로 작업합니다. 이제 공식 문서에 표시된 대로 <code>useHydrateAtoms</code> 후크를 사용하여 초기 상태를 원자에 전달하려고 시도하지만 이로 인해 수화 오류가 발생합니다. </p> <p>다음은 현재 사용되는 코드의 단순화된 버전입니다. 이 버전은 서버측 구성요소에서 수신된 데이터를 <code>useHydrateAtoms</code>를 호출하고 <code> useAtom</ code> 이 Atom에서 읽고 씁니다. </p> <h5>서버 구성요소(페이지)</h5> <pre class="brush:php;toolbar:false;">const getData = async () => // ... } 기본 비동기 함수 내보내기 Page() { const 데이터 = getData()를 기다립니다; return <ChildComponentinitialState={data} /> }</pre> <h5>클라이언트 구성요소</h5> <pre class="brush:php;toolbar:false;">"클라이언트 사용" 내보내기 함수 ChildComponent({initialState }) { useHydrateAtoms([[myAtom,initialState]]); const [data, setData] = useAtom(myAtom); return <>{data.id}</> }</pre> <p><code>next/dynamic</code>를 사용하여 하위 구성요소를 동적으로 가져오고 SSR 옵션을 false로 설정하거나 <code>useHydrateAtoms</code> 후크를 제거하면 오류가 완전히 사라집니다. 두 솔루션 모두 이 구현의 목적을 상실합니다. </p> <p>첫 번째 클라이언트 렌더링에서 원자가 <code>null</code>되지 않도록 서버의 값을 사용하여 원자에 초기 상태를 제공하려면 어떻게 해야 합니까? </p>