리액트 쿼리에서 특정 조건일때는 data를 불러오지 않도록 처리할 수 있다.

 

export const useData = (id: number) => {
  const query = useQuery(["data"], () => axios.get<DataType[]>(`{api주소}`).then((res) => res.data), {
    enabled: id === 0 ? false : true,
  });
  return query;
};

 

id를 넣어서 데이터를 불러오는데, 사용처에서 useEffect안에서 use훅으로 조건에 맞춰 데이터를 불러오는 동작을 할 수 없다보니 에러가 생긴다.

 

이럴땐 기본값이거나 데이터를 불러오는 동작을 하지 않고 싶을땐 의도적으로 id값을 0으로 설정해주고,

enabled를 추가하여서 id가 0이 아닐때만 동작하게 하도록 한다.