API, Database/GraphQL

[GraphQL] Apollo-Client / useQuery data 이름 변경하는 방법

쭈꾸미 2022. 1. 24. 17:56

useQuery의 기본 형태

Apollo-client의 useQuery 기본 형태는 다음과 같다.

// 예시는 게시판 댓글 목록을 읽어오는 API
const { data } = useQuery(FETCH_BOARD_COMMENTS, {
        variables: { boardId: String(router.query.new) }
    })
    
// FETCH_BOARD_COMMENTS는 지정해준 함수명
// boardId: String(router.query.new)는 useQuery시 필요한 key와 value

useMutation과는 다르게 useQuery의 경우 { data } 부분이 고정되어있다. 하지만 중복 등의 이유로 이 data의 이름을 변경해야 하는 상황이 발생할 수 있다. 그런 경우에 어떻게 변경할 수 있을까?

const { data: dataComments } = useQuery(FETCH_BOARD_COMMENTS, {
        variables: { boardId: String(router.query.new) }
    })

상단과 같이 { data: [원하는이름] }을 입력하면 임의로 변경이 가능하다.