loadQuery

loadQuery

此函數設計與 usePreloadedQuery() Hook 一起使用，以實作「載入時渲染」功能。

如果不在不再參照從 loadQuery 傳回的查詢參照上呼叫 .dispose()，查詢參照將會把資料洩漏到 Relay 存放區中。因此，盡可能呼叫 useQueryLoader，以確保系統會為您處置查詢參照。

請參閱usePreloadedQuery 文件，取得更完整的範例。

const MyEnvironment = require('MyEnvironment');
const {loadQuery} = require('react-relay');

const query = graphql`
  query AppQuery($id: ID!) {
    user(id: $id) {
      name
    }
  }
`;

// Note: you should generally not call loadQuery at the top level.
// Instead, it should be called in response to an event (such a route navigation,
// click, etc.).
const queryReference = loadQuery(
  MyEnvironment,
  query,
  {id: '4'},
  {fetchPolicy: 'store-or-network'},
);

// later: pass queryReference to usePreloadedQuery()
// Note that query reference should have .dispose() called on them,
// which is missing in this example.

引數

• environment：執行要求的 Relay Environment 執行個體。如果您在 React 元件內的某處啟動此要求，您可能想要使用透過 useRelayEnvironment 取得的環境。
• query：要擷取的 GraphQL 查詢，使用 graphql 樣板文字或可預先載入的具體要求指定，這可以透過要求檔案 <query 名稱>$Parameters.graphql 取得。如果查詢有使用 @preloadable 註解，Relay 只會產生 $Parameters 檔案。
• variables：包含要擷取查詢的變數值的物件。這些變數需要符合查詢內宣告的 GraphQL 變數。
• options：[選用]選項物件
  • fetchPolicy：決定是否應使用快取資料，以及是否根據 Relay 存放區中目前可用的快取資料，傳送網路要求 (如需更多詳細資訊，請參閱我們的擷取原則和垃圾收集指南)
    • 「store-or-network」：(預設)會重複使用本機快取資料，而且只有在查詢有任何資料遺失時，才會傳送網路要求。如果查詢已完全快取，則不會發出網路要求。
    • 「store-and-network」：會重複使用本機快取資料，而且一律會傳送網路要求，無論本機快取中是否有遺失任何資料。
    • 「network-only」：不會重複使用本機快取資料，而且一律會傳送網路要求以擷取查詢，忽略可能在本機快取於 Relay 中的任何資料。
  • networkCacheConfig：[選用]預設值：{force: true}。包含網路層快取設定選項的物件。請注意，網路層可能包含額外的查詢回應快取，這會重複使用相同查詢的網路回應。如果您想要完全略過此快取 (這是預設行為)，請將 {force: true} 當做此選項的值傳遞。
• environmentProviderOptions：[選用]選項物件
  • 傳遞至 prepareSurfaceEntryPoint.js 中使用的 environmentProvider 的選項。

傳回值

具有下列屬性的查詢參照

• dispose：一種方法，可釋放查詢參照，使其不再由存放區保留。這可能會導致由查詢參照參照的資料被垃圾收集。

傳回值的確切格式不穩定，而且極有可能變更。我們強烈建議不要使用傳回值的任何其他屬性，因為當升級至未來版本的 Relay 時，這類程式碼很可能會中斷。請將 loadQuery() 的結果傳遞至 usePreloadedQuery()。

行為

• 如果傳遞查詢，loadQuery() 將會擷取資料，如果傳遞可預先載入的具體要求，則會擷取資料和查詢。一旦查詢和資料都可供使用，查詢中的資料將會寫入存放區。這與 preloadQuery_DEPRECATED 的行為不同，後者僅會在將查詢傳遞至 usePreloadedQuery 時，才會將資料寫入存放區。
• 從 loadQuery 傳回的查詢參照將由 Relay 存放區保留，防止資料被垃圾收集。一旦您在查詢參照上呼叫 .dispose()，它就可以被垃圾收集。
• 如果在 React 的渲染階段期間呼叫 loadQuery()，則會擲回錯誤。

---

此頁面是否實用？

請協助我們回答一些快速問題，以讓網站更加完善 回答幾個快速問題.