javascript - React で POST API 呼び出しからデータをレンダリングする方法

Question

API呼び出しから各フィールドにアクセスしてレンダリングし、複数のコンポーネントで使用できるように、現在のAPI呼び出しをコーディングする方法を見つけようとしています。POST のみがフィールド値をプルできるようにする QuickBase API 呼び出しを使用しています。私は数年間ゲームから離れていましたが、api.js ファイルをインポートして他のコンポーネントで使用できるようにこれらを正確にレンダリングする方法がわかりません。このプロジェクトは、QuickBase データを取得するための Electron 内の React であり、折れ線グラフ (1 ページに 7 つ) を作成して、ジョブのコスト/時間と、ジョブに含まれる部門のコスト/時間を表示できます。私のデータはすべてクイックベースにあります。反応して実際に使用できるようにする方法がわかりません!

ここに私のAPI呼び出しがあります:

let headers = {
  'QB-Realm-Hostname': 'XXXXXXXXX.quickbase.com',
  'User-Agent': 'FileService_Integration_V2.1',
  'Authorization': 'QB-USER-TOKEN XXXXXX_XXXXX_XXXXXXXXXXXXXXX',
  'Content-Type': 'application/json'
}
let body = {"from":"bpz99ram7","select":[3,6,80,81,82,83,86,84,88,89,90,91,92,93,94,95,96,97,98,99,101,103,104,105,106,107,109,111,113,115,120,123,224,225,226,227,228,229,230,231,477,479,480,481],"sortBy":[{"fieldId":6,"order":"ASC"}],"groupBy":[{"fieldId":40,"grouping":"equal-values"}],"options":{"skip":0,"top":0,"compareWithAppLocalTime":false}}

fetch('https://api.quickbase.com/v1/records/query',
  {
    method: 'POST',
    headers: headers,
    body: JSON.stringify(body)
  })
  
.then(res => {
  if (res.ok) {
    return res.json().then(res => console.log(res));
  }

return res.json().then(resBody => Promise.reject({status: res.status, ...resBody}));
})

.catch(err => console.log(err))

私はこれにしばらく苦労していたので、どんな助けでも大歓迎です！現在、コンソールですべての正しいデータを取得できます。しかし、実際に使用するためにアプリケーションでレンダリングする方法がわかりません。

ありがとう！