마운트 후에만 액세스할 수 있는 데이터로 후크를 초기화하는 방법은 무엇입니까?

Question

다음은 제가 하려는 일의 예입니다:

으아악

보시다시피 저는 id 값을 사용하여 useCollection 후크를 초기화합니다. 그러나 ID가 변경되어 먼저 정의되지 않은 다음 올바른 값으로 변경됩니다. 이로 인해 모든 것이 무너지고 위의 내용은 TypeScript에서도 작동하지 않습니다. ID를 정의한 후 useCollection 후크를 초기화해야 합니다. 이는 구성 요소가 "설치"된 후에만 발생합니다. useEffect 안에 useCollection(...)을 넣으려고 했지만 작동하지 않습니다.

Answer 1

nextjs를 사용하고 있으므로 getServerSideProps 구성 요소의 ID를 초기 prop으로 생성하여 항상 정의되도록 할 수 있습니다.

으아아아

그리고 컴포넌트로부터 소품으로 받습니다:

으아아아