TIL 01.11

새양말·2023년 1월 10일
0

내일배움캠프TIL

목록 보기
46/74
post-thumbnail

useQuery에 대해 공부를 해야된다!! 못햇수

기본 형태

const result = useQuery('todos', fetchTodoList)

여기서 'todos'가 쿼리키,
fetchTodoList가 프로미스를 반환하는 함수이다.

내가 만든 코드

  const { data: musicalData, isLoading: isLoadingMD } = useQuery(
    ['MusicalData', musicalId],
    getMusicalData
  );

getMusicalData함수로 받아온 data 이름을 musicalData로 지어주었다. (isLoading도 마찬가지)

쿼리키는 배열로 넣어줘도 돼서
['MusicalData', musicalId]라고 두었는데
왜 이렇게 쓰는지 모르겠다. 실질적으로 쓰는 건 musicalId이다.

함수는 이런식으로 썼다.(뒷부분 생략)

export const getMusicalData = (params) => {
  const [_, musicalId] = params.queryKey;
  return fetch(`${BASE_URL}/pblprfr/${musicalId}?service=${API_KEY}`)

파라미터를 가져와서 쿼리키로 저장하고?
fetch함수를 썼다.
중요한 건 promise객체를 반환하는 함수여야 하기 때문에
콜백함수를 써야 한다는 것이다.

내일은 아마...
할 게 너무 많아서 될지 잘 모르겠지만
수정 삭제 시간 돼면 내가 한다.

 const {
   data,
   error,
   isError,
   isIdle,
   isLoading,
   isPaused,
   isSuccess,
   mutate,
   mutateAsync,
   reset,
   status,
 } = useMutation(mutationFn, {
   mutationKey,
   onError,
   onMutate,
   onSettled,
   onSuccess,
   retry,
   retryDelay,
   useErrorBoundary,
   meta,
 })
 
 mutate(variables, {
   onError,
   onSettled,
   onSuccess,
 })
profile
매번 기합넣는 양말

0개의 댓글