1
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 3 years have passed since last update.

[日本語訳]SWR ドキュメンテーション 自動再検証

Last updated at Posted at 2021-01-04

このページは Automatic Revalidation – SWRの日本語訳です
SWR日本語訳全体についてはSWR 日本語訳をご覧ください

自動再検証

💡 データを手動で再検証する場合は、ミューテーションを確認してください。

フォーカスでの再検証

ページに再度フォーカスを合わせるか、タブを切り替えると、SWRは自動的にデータを再検証します。

これは、最新の状態にすぐに同期するのに役立ちます。 これは、古いモバイルタブや、スリープ状態になったラップトップなどのシナリオでデータを更新する場合に役立ちます。

動画: 本家ドキュメントでご覧ください
ビデオ:フォーカスの再検証を使用して、ページ間でログイン状態を自動的に同期します。

この機能はデフォルトで有効になっています。 revalidateOnFocusオプションを使用して無効にすることができます。

時間間隔での再検証

多くの場合、複数のデバイス、複数のユーザー、複数のタブからデータが変更されます。 画面上のデータを時間の経過とともに更新するにはどうすればよいでしょうか?

SWRには、データを自動的に再フェッチするオプションがあります。 これはスマートです。つまり、hook に関連するコンポーネントが画面に表示されている場合にのみ、再フェッチが行われます。

動画: 本家ドキュメントでご覧ください
ビデオ:ユーザーが変更を加えると、両方のセッションが最終的に同じデータをレンダリングします。

refreshIntervalの値を設定することで有効にできます。


useSWR('/api/todos', fetcher, { refreshInterval: 1000 })

refreshWhenHiddenrefreshWhenOffline などのオプションもあります。 両方ともデフォルトで無効になっているため、Webページが画面に表示されていない場合、またはネットワーク接続がない場合、SWRはフェッチしません。

再接続での再検証

ユーザーがオンラインに戻ったときに再検証するにも役立ちます。よくあるシナリオはユーザーがコンピューターのロックを解除したときにインターネットにはまだ接続されていない場合です。

データが常に最新であることを確認するために、SWRはネットワークが回復したときに自動的に再検証します。

この機能はデフォルトで有効になっています。revalidateOnReconnect オプションを使用して無効にすることができます。

1
0
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
1
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?