執行階段函式

本頁記錄與 Relay 解析器相關的執行階段函式。如需 Relay 解析器的概述以及如何思考它們，請參閱Relay 解析器指南。

LiveResolverStore

若要使用 Relay 解析器，您必須使用我們從 relay-runtime/lib/store/experimental-live-resolvers/LiveResolverStore 匯入的實驗性 Relay Store 實作 LiveResolverStore。其行為與預設的 Relay Store 完全相同，但也支援 Relay 解析器。

它公開了一個額外的使用者介面方法 batchLiveStateUpdates()。如需如何使用此方法的更多詳細資訊，請參閱即時欄位。

readFragment()

衍生解析器欄位會對圖形中衍生自其他資料的資料進行建模。若要讀取衍生欄位所依賴的資料，它們必須使用從 relay-runtime 匯出的 readFragment() 函式。此函式接受 GraphQL 片段和片段鍵，並傳回片段的資料。

危險

readFragment() 只能在 Relay 解析器中使用。如果在任何其他情況下使用，將會擲回錯誤。

import {readFragment} from "relay-runtime";

/**
 * @RelayResolver User.fullName: String
 * @rootFragment UserFullNameFragment
 */
export function fullName(key: UserFullNameFragment$key): string {
  const user = readFragment(graphql`
    fragment UserFullNameFragment on User {
      firstName
      lastName
    }
  `, key);
  return `${user.firstName} ${user.lastName}`;
}

請注意，Relay 將確保您的欄位解析器在該片段中的資料變更時重新計算。

如需更多資訊，請參閱衍生欄位指南。

suspenseSentinel()

即時解析器會對可以隨時間變化的用戶端狀態進行建模。如果在該欄位生命週期的某個時間點，讀取的資料處於擱置狀態，例如從 API 提取資料時，解析器可能會傳回 suspenseSentinel()，以表示資料尚未準備好。

Relay 預期當資料可用時，LiveStateValue 將透過呼叫訂閱回呼來通知 Relay。

import {suspenseSentinel} from 'relay-runtime';

/**
 * @RelayResolver Query.myIp: String
 * @live
 */
export function myIp(): LiveState<string> {
  return {
    read: () => {
      const state = store.getState();
      const ipLoadObject = state.ip;
      if (ipLoadObject.status === "LOADING") {
        return suspenseSentinel();
      }
      return state.ip;
    },
    subscribe: (callback) => {
      return store.subscribe(callback);
    },
  };
}

如需更多資訊，請參閱即時欄位指南。

useClientQuery()

如果查詢僅包含用戶端欄位，則目前可能無法與 usePreloadedQuery 和 useLazyLoadQuery 等 Hook 一起使用，因為這兩個 Hook 都假設它們需要發出網路請求。如果您嘗試在 Flow 中使用這些 API，將會收到類型錯誤。

相反地，對於僅限用戶端的查詢，您可以使用 useClientQuery Hook

import {useClientQuery} from 'react-relay';

export function MyComponent() {
  const data = useClientQuery(graphql`
    query MyQuery {
      myIp
    }
  `);
  return <div>{data.myIp}</div>;
}