問題タブ [react-tsx]

オブジェクトの配列を受け取ることを期待するクエリを呼び出すReactコンポーネントがあります（検証データ用）。次に、それを使用して html フォームを検証します。これは、apollo Mutation 要素内で定義されます。コンポーネント メソッドの return ステートメント内で構造化されているrender()方法は機能しますが、面倒に見え、コールバック地獄の時代を思い出させます。<QueryCustomerValidations>私が本当にやりたいことは、メソッド内の要素を取り除き、render()(理想的には)componentDidMountライフサイクル イベントに移動することです。後でフォーム内で使用するためにバリデーターをそこにロードできるように、<MutationCreateCustomer>render() 内をそのままにしておきます。

現時点では、フォームをミューテーション内にラップする必要があります。適切な順序で非同期データを受け取るためにクエリが返すアロー関数内のミューテーション。

ドキュメントの目的で、クエリを作成するためのインターフェイスを次に示します。apollo クライアントを使用してサーバーからこのデータの一部を取得するため、この場合、単純なグラフクエリ ソリューションはonDidMount()機能しません。

getCustomerValidations.ts (Interfaces)

customer-validations.query.ts (Client side query types)

<QueryCustomerValidations>適切な解決策は、メソッドから要素をコピーしてトリガーするcomponentDidMount()方法、またはメソッドから要素を取り出して、render()何らかの「待機」方法で呼び出す方法です。これにより、最初に呼び出すことができますおよびその後の突然変異 (およびクエリからのデータの使用)。

ありがとう、私はこれを理解するのが本当に簡単ではないことを知っています.