-
카테고리
-
세부 분야
프론트엔드
-
해결 여부
해결됨
hooks 에러
23.07.27 14:58 작성 23.07.27 15:00 수정 조회수 488
0
안녕하세요!
다음과 같이 hook
이 선언되기 전에 if조건문
이 위치하여 오류가 발생하였습니다. useMutation
은 조건문이 실행되기 전에 선언해주면 해결되었는데 useQuery
는 router
를 사용하기 때문에 조건문보다 먼저 선언이 될 수 없었습니다.
그래서 조건문을 없애기 위해서 router.query.boardId
를 string타입
으로 변환하여도 상관이 없나요?
1차 오류 발생
if (!router || typeof router.query.boardId !== "string") return <></>;
const { data } = useQuery<
Pick<IQuery, "fetchBoardComments">,
IQueryFetchBoardCommentsArgs
>(FETCH_BOARD_COMMENTS, {
variables: { boardId: router.query.boardId },
});
const [deleteBoardComment] = useMutation<
Pick<IMutation, "deleteBoardComment">,
IMutationDeleteBoardCommentArgs
>(DELETE_BOARD_COMMENT);
//오류 원인
React Hook "useMutation" is called conditionally.
React Hooks must be called in the exact same order in every component render.
Did you accidentally call a React Hook after an early return? const { data } = useQuery<
//string으로 변환
const { data } = useQuery<
Pick<IQuery, "fetchBoardComments">,
IQueryFetchBoardCommentsArgs>(FETCH_BOARD_COMMENTS, {
variables: { boardId: String(router.query.boardId) },
});
답변을 작성해보세요.
답변 1