😍GitHub GraphQL API documentation

https://docs.github.com/en/graphql

Explorer - GitHub DocsGitHub Docs

Chúng ta nhận thấy ở đây là chúng ta đang query cùng các field bên trong field owner nhiều lần. Đây là lúc thích hợp để chúng ta sử dụng Fragment

• Chúng ta sẽ tạo một fragment gọi là ownerInfo với từ khoá fragment. Để tạo một Fragment chúng ta phải nói cho GraphQL biết rằng Fragment này được tạo ra trên field nào. Trong trường hợp này, chúng ta sẽ tạo 1 Fragment trên fieldRepositoryOwner

• Trong Body của Fragment, chúng ta có thể bao gồm tất cả các field của đối tượng RepositoryOwner. Ở đây chúng ta định nghĩa các field là id, avatarUrl, resourcePath, url là các field của fragment ownerInfo

// fragment ownerInfo for RepositoryOwner fields
fragment ownerInfo on RepositoryOwner {
  id
  avatarUrl
  resourcePath
  url
}

5. Sử dụng một GraphQL Fragment

Chúng ta có thể sử dụng Fragment mà chúng ta sử dụng ở ví dụ trước trong phạm vi một query bằng việc sử dụng toán tử ... và theo sau là tên của Fragment

// GraphQL Query with fragments

{
  googleRepo: repository(owner: "google", name: "WebFundamentals") {
    name
    owner {
      ...ownerInfo //fragment
    }
  }
  facebookRepo: repository(owner: "facebook", name: "react") {
    name
    owner {
     ...ownerInfo //fragment
    }
  }
}

Response của query khi chúng ta sử dụng Fragment sẽ không thay đổi so với khi chúng ta không sử dụng Fragment. Fragment chỉ đơn giản là làm cho câu query được clean hơn, dễ đọc, và tái sử dụng

6. Kết luận

• Fragment là một khái niệm rất thú vị trong GraphQL, nó cho phép tái sử dụng trong khi viết các câu query, loại bỏ các đoạn mã phải viết đi viết lại, giúp các câu query dễ đọc dễ hiểu hơn. Mong qua bài viết này, các bạn sẽ hiểu hơn về khái niệm Fragment và có thể sử dụng Fragment khi viết GraphQL Schema cũng như không bỡ ngỡ mỗi khi đọc Schema có sử dụng Fragment