どのように次のSWRを使用します.jsアプリ

SWRは古い間、再検証します.これは、フェッチ、キャッシュ、またはリアルタイムでリアルタイムでデータを再フェッチすることができますライトライブラリです.

import useSWR from "swr";

 const fetcher = (url) => fetch(url)
 .then((res) => res.json())
 .then(json => {
   return json
 });

 const useSwrFetcher = url => { 
     return useSWR(url, fetcher); 
  }

SWRを使用するには、まずNPMや糸を使用してプロジェクトにインストールします.
上記のコードスニペットでは、機能コンポーネントfetcherはAPI URLをパラメータとして受け取り、その後APIからJSON応答を返します.
その後、再利用可能な機能コンポーネントuseswrfetcher(任意の名前を指定することができます)はUSEWRフックを呼び出し、APIのデータを返すためにAPI URLとFETcher(任意の名前を指定することができます)を渡します.
以下の例では、再利用可能なコンポーネントの使用を示します.

const API_URL = 'typeyourapihere...';
export const Users = () => {
    const {data: users, error} =
    useSwrFetcher(API_URL+"/users");
    return (
    users.map((user, i) => {
    return <>
    <span>Name: {user.name}</span>
    <span>Age: {user.age}</span>
    </>
    })
    );
    }

関数コンポーネントユーザーは、再利用可能なコンポーネントuseswrfetcherを呼び出してAPIからユーザーを取得し、マップ関数を使用して取得したユーザーのデータ(名前と年齢)を表示します.