GraphQL片段應(yīng)用於避免查詢(xún)中重複字段，提高可維護(hù)性並啟用模塊化代碼。 1。定義可重複使用的字段選擇，例如用戶(hù){id name email avatar}上的fragment用戶(hù)字段，以消除重複。 2.使用...在任何查詢(xún)返回用戶(hù)中的用戶(hù)字段以集中更新 - 添加一個(gè)字段只需要一個(gè)更改。 3。與組件分類(lèi)的片段，例如在React中定義usercardfragment，以聲明精確的數(shù)據(jù)需求。 4。通過(guò)嵌套片段（例如包括用戶(hù)域）的後場(chǎng)來(lái)構(gòu)建複雜查詢(xún)。 5。遵循最佳實(shí)踐：使用清晰的名稱(chēng)，保持碎片為重點(diǎn)，利用工具進(jìn)行驗(yàn)證，並避免過(guò)度築巢。 6。在現(xiàn)實(shí)世界應(yīng)用中，從組件片段中撰寫(xiě)父級(jí)查詢(xún)，在片段更改時(shí)啟用自動(dòng)更新。片段減少錯(cuò)誤，提高可擴(kuò)展性，並在查詢(xún)時(shí)間解決，而無(wú)需運(yùn)行時(shí)成本，這對(duì)於有效的GraphQL開(kāi)發(fā)至關(guān)重要。

GraphQl片段是GraphQl最被低估但功能最強(qiáng)大的功能之一。它們讓您定義可重複使用的查詢(xún)片段，使您的代碼更清潔，更可維護(hù)且易於錯(cuò)誤。您可以在多個(gè)查詢(xún)或組件上重複相同的字段，而是可以定義一次並在需要的任何地方重複使用它們。

這是碎片在日常開(kāi)發(fā)中真正改變的方式。

什麼是GraphQl片段？

片段是可以在查詢(xún)，突變或其他片段中共享的字段的指定選擇。您將其定義一次，然後使用...語(yǔ)法將其擴(kuò)展到您的操作中。

例如：

用戶(hù)上的fragment用戶(hù)field {
  ID
  姓名
  電子郵件
  頭像
}

現(xiàn)在，您可以在返回User任何查詢(xún)中使用它：

查詢(xún)getCurrentuser {
  當(dāng)前使用者{
    ...用戶(hù)場(chǎng)
  }
}

查詢(xún)getuser（$ id：id！）{
  用戶(hù)（id：$ id）{
    ...用戶(hù)場(chǎng)
  }
}

這避免了每次獲取用戶(hù)時(shí)重複相同的四個(gè)字段。

為什麼使用片段？關(guān)鍵好處

1。避免重複，提高可維護(hù)性

當(dāng)您需要添加一個(gè)新字段（例如， phone ）以獲取用戶(hù)的每個(gè)地方，則只需更新片段即可。無(wú)需尋找每個(gè)查詢(xún)。

沒(méi)有片段，您可以手動(dòng)更新多個(gè)查詢(xún)。有了片段，這是一個(gè)單行的變化。

2。與組件分配數(shù)據(jù)要求

在前端框架中，例如與阿波羅客戶(hù)端進(jìn)行反應(yīng)，通常在使用它的組件中定義片段。

 const usercardfragment = gql`
  用戶(hù)上的fragment usercardfields {
    ID
    姓名
    頭像
    角色
  }
`;

然後，任何呈現(xiàn)UserCard的父母查詢(xún)都可以包括...UserCardFields 。這遵循數(shù)據(jù)共置的原理 - 該組件準(zhǔn)確地聲明了它需要的數(shù)據(jù)。

3。啟用模塊化和可擴(kuò)展代碼

隨著您的應(yīng)用程序的增長(zhǎng)，查詢(xún)複雜性也是如此。片段讓您構(gòu)建像樂(lè)高積木之類(lèi)的查詢(xún)。

例如：

郵政上的片段{
  ID
  標(biāo)題
  內(nèi)容
  作者 {
    ...用戶(hù)場(chǎng)
  }
  創(chuàng)建
}

現(xiàn)在， PostFields重新使用UserFields 。這種嵌套使事物保持乾燥和分層。

使用片段的最佳實(shí)踐

• 清楚地命名：使用描述性名稱(chēng)，例如UserProfileFields或CommentListItem ，因此很明顯使用它們的位置。
• 保持它們的重點(diǎn)：片段應(yīng)反映一個(gè)邏輯數(shù)據(jù)單元，理想地與UI組件或域?qū)ο蠼壎ā?/li>
• 與工具結(jié)合使用：Apollo客戶(hù)端，繼電器和其他客戶(hù)端可以驗(yàn)證您的片段與實(shí)際模式兼容，並警告如果缺少字段，則可以警告。
• 避免過(guò)度粘貼：雖然嵌套片段強(qiáng)大，但太多的層可能會(huì)使查詢(xún)難以遵循。使用判斷。

現(xiàn)實(shí)世界中的片段

在基於組件的應(yīng)用程序中，每個(gè)組件導(dǎo)出其片段。高級(jí)查詢(xún)將這些片段組合在一起。

示例結(jié)構(gòu)：

 // useravatar.js
導(dǎo)出const useravatarfragment = gql`
  用戶(hù){
    頭像
    姓名
  }
`;

// userbio.js
導(dǎo)出const userbiofragment = gql`
  用戶(hù){
    姓名
    生物
    網(wǎng)站
  }
`;

// userProfile.js
const userProfilequery = gql`
  查詢(xún)UserProfile（$ ID：ID！）{
    用戶(hù)（id：$ id）{
      ... useravatarfragment
      ... Userbiofragment
    }
  }
`;

這樣，當(dāng)UserBio需要一個(gè)新字段時(shí)，您只需更新該片段，並且查詢(xún)會(huì)自動(dòng)包含它。

片段不會(huì)添加運(yùn)行時(shí)開(kāi)銷(xiāo)，它們?cè)诰幾g/查詢(xún)時(shí)間下解決。他們純粹是開(kāi)發(fā)人員的體驗(yàn)。

基本上，如果您多次編寫(xiě)相同的字段，則應(yīng)使用片段。這不是魔術(shù)，但是隨著時(shí)間的流逝，它會(huì)產(chǎn)生很大的不同。

以上是GraphQl片段的功能可重複使用的查詢(xún)的詳細(xì)內(nèi)容。更多資訊請(qǐng)關(guān)注PHP中文網(wǎng)其他相關(guān)文章！