해결된 질문
24.07.15 12:22 작성
·
126
0
"use client";
하위의 컴포넌트는 Client로 랜더링 된다고 하신거 같은데,
QueryClientProvider가 client에서 랜더링 되는건 아닌가요?
해당 파일을 가보니 'use client'를 사용하고 있어서요.
<QueryClientProvider></QueryClientProvider>로 감싸도 그 하위에 컴포넌트들이 SSR가 되는지 궁금합니다.
'use client'
import * as React from 'react'
import type { QueryClient } from '@tanstack/query-core'
export const QueryClientContext = React.createContext<QueryClient | undefined>(
undefined,
)
export const useQueryClient = (queryClient?: QueryClient) => {
const client = React.useContext(QueryClientContext)
if (queryClient) {
return queryClient
}
if (!client) {
throw new Error('No QueryClient set, use QueryClientProvider to set one')
}
return client
}
export type QueryClientProviderProps = {
client: QueryClient
children?: React.ReactNode
}
export const QueryClientProvider = ({
client,
children,
}: QueryClientProviderProps): React.JSX.Element => {
React.useEffect(() => {
client.mount()
return () => {
client.unmount()
}
}, [client])
return (
<QueryClientContext.Provider value={client}>
{children}
</QueryClientContext.Provider>
)
}
2024. 07. 15. 12:38
모든 하위 컴포넌트가 클라이언트 컴포넌트가 되는것이 아닌,
"use client"; 가 선언된 파일을 임포트한 컴포넌트가 클라이언트 컴포넌트가 된다는 말씀이신가요?