dynamic routing board mutation

게시물 등록과 동적 라우팅 연동 실습

게시글 등록 페이지
등록버튼 누르면 해당 게시글의 상세페이지

const 나의그래프큐엘셋팅 = gql`
  mutation createGraphql($writer: String!, $title: String!, $contents: String!) {
    createGraphql(writer: $writer, title: $title, contents: $contents) {
      message
    }
  }
`;

기존에는 단순히 등록 성공 메시지만 출력했는데
이번엔 해당 게시물의 id도 받아올 수 있도록 해보자.

const 나의그래프큐엘셋팅 = gql`
  mutation createGraphql($writer: String!, $title: String!, $contents: String!) {
    createGraphql(writer: $writer, title: $title, contents: $contents) {
      message
      writer
      title
      contents
      id
    }
  }
`;

받아오는 값들을 몇가지 추가해주고 값 등록을 해보면

id값을 포함한 값들이 나온다
해당 id값만 따로 출력하려면

console.log(result.data.createGraphql.id)

해당 데이터의 data createGraphql id 순으로 들어가보면

이렇게 필요한 값만 뽑아올 수 있다.
해당 값을 사용해서 주소에 넣어보자

router.push("/section05/05-05-dynamic-routing-board-mutation-moved/" + result.data.createGraphql.id)

router.push(`/section05/05-05-dynamic-routing-board-mutation-moved/${result.data.createGraphql.id}`)

둘중 하나를 사용해서 이동할 주소를 설정하면

api 요청시

자동으로 해당 게시글로 이동하게 된다.