react-apollo-hooksを使用して関数でuseQueryを呼び出してみます

Question

必要なときにuseQueryを呼び出したいので、

ただし、useQueryは関数内では使用できません。

私の試行コードは：

export const TestComponent = () => {
...
  const { data, loading, error } = useQuery(gql(GET_USER_LIST), {
    variables: {
      data: {
        page: changePage,
        pageSize: 10,
      },
    },
  })
  ...
  ...
  const onSaveInformation = async () => {
    try {
      await updateInformation({...})
      // I want to call useQuery once again.
    } catch (e) {
      return e
    }
}
...

UseQueryを複数回呼び出すにはどうすればよいですか？

いつでも電話できますか？

いくつかのサイトを探しましたが、解決策が見つかりませんでした。

Answer 1

UseQueryをどのように使用すべきかについての回答と、useLazyQueryを使用するための提案があります。重要なポイントは、ドキュメントで読むことができるuseQueryとuseLazyQueryのユースケースを理解することです。以下、私の見方から説明します。

seQuery は、Reactの他の部分、特にコンポーネントのレンダリングによく似た「宣言型」です。これは、状態または小道具が変化したときに、レンダリングごとにuseQueryが呼び出されることを期待する必要があることを意味します。つまり、英語では、「Hey React、物事が変わると、これはwhatクエリしてほしい」のようになります。

seLazyQuery の場合、ドキュメントのこの行が重要です：「useLazyQueryフックは、コンポーネントのレンダリング以外のイベントに応答してクエリを実行するのに最適です」。より一般的なプログラミングの話では、それは「必須」です。これにより、状態/プロパティの変更（useEffectなど）への応答であれ、ボタンのクリックなどのイベントハンドラーであれ、クエリを任意の方法で呼び出すことができます。英語では、「Hey React、これはhowデータを照会したい」のようなものです。