useEntryPointLoader

useEntryPointLoader

EntryPointを安全に使用し、データがRelayストアに漏れないようにするのを容易にするフックです。EntryPoint参照をステートに保持し、ステートからアクセスできなくなったときに破棄します。

const {useEntryPointLoader, EntryPointContainer} = require('react-relay');

const ComponentEntryPoint = require('Component.entrypoint');

function EntryPointRevealer(): React.MixedElement {
  const environmentProvider = useMyEnvironmentProvider();
  const [
    entryPointReference,
    loadEntryPoint,
    disposeEntryPoint,
  ] = useEntryPointLoader(environmentProvider, ComponentEntryPoint);

  return (
    <>
      {
        entryPointReference == null && (
          <Button onClick={() => loadEntryPoint({})}>
            Click to reveal the contents of the EntryPoint
          </Button>
        )
      }
      {
        entryPointReference != null && (
          <>
            <Button onClick={disposeEntryPoint}>
              Click to hide and dispose the EntryPoint.
            </Button>
            <Suspense fallback="Loading...">
              <EntryPointContainer
                entryPointReference={entryPointReference}
                props={{}}
              />
            </Suspense>
          </>
        )
      }
    </>
  );
}

引数

• environmentProvider: getEnvironmentメソッドでRelay環境を返すオブジェクト。
• EntryPoint: EntryPoint、通常は.entrypoint.jsファイルのインポートによって取得されます。

フロー型パラメータ

• TEntryPointParams: EntryPointのgetPreloadPropsメソッドの最初の引数の型。
• TPreloadedQueries: EntryPointコンポーネントに渡されるqueriesプロパティの型。
• TPreloadedEntryPoints: EntryPointコンポーネントに渡されるentryPointsプロパティの型。
• TRuntimeProps: EntryPointContainerに渡されるpropsプロパティの型。このオブジェクトはEntryPointコンポーネントにもpropsとして渡されます。
• TExtraProps: EntryPointのgetPreloadPropsメソッドがextraPropsプロパティを含むオブジェクトを返した場合、それらの追加プロパティはEntryPointコンポーネントにextraPropsとして渡され、型はTExtraPropsとなります。
• TEntryPointComponent: EntryPointコンポーネントの型。
• TEntryPoint: EntryPointの型。

戻り値

次の値を含むタプル

• entryPointReference: EntryPoint参照、またはnull。
• loadEntryPoint: 実行時にエントリポイントをロードするコールバックです。エントリポイントはentryPointReferenceとしてアクセス可能です。前のエントリポイントがロードされている場合は破棄します。React のレンダリング フェーズ中に呼び出される場合はエラーがスローされることがあります。
  • パラメーター
    • params: TEntryPointParams: エントリポイント getPreloadPropsメソッドに渡されるパラメーター。
• disposeEntryPoint: 実行時に entryPointReferenceをnullに設定して.dispose()を呼び出すコールバックです。void型です。React のレンダリング フェーズ中に呼び出すことはできません。

動作

• loadEntryPointコールバックが呼び出されると、エントリポイントに関連付けられたクエリ（ある場合）のそれぞれが、クエリデータとクエリ AST をロードします。クエリ AST とデータの両方が利用可能になれば、データはストアに書き込まれます。これは、クエリが usePreloadedQueryを使用してレンダリングされた場合にのみ関連付けられたクエリからデータをストアに書き込んだ prepareEntryPoint_DEPRECATEDの動作とは異なります。
• エントリポイント参照の関連付けられたクエリ参照は Relay ストアによって保持され、データがガベージコレクトされるのを防ぎます。エントリポイント参照で .dispose()を呼び出すと、関連付けられたクエリからのデータはガベージコレクトされる可能性があります。
• loadEntryPoint コールバックは、React のレンダリング フェーズ中に呼び出された場合にエラーをスローすることがあります。

---

このページは役に立ちましたか。

いくつかの簡単な質問に答えることで サイトをさらに改善するのに協力してください。.