Reactjs 如何使用react js获得alpha vantage api库存

我正在尝试获取ReactJS中的alpha vantage api股票响应数据。我不知道怎么做。。有人能帮我吗？提前谢谢，我真的很感激你给我的任何帮助或建议。 我想把这些信息放在表格里

import React from 'react';

import './App.css';
import { useState,useEffect } from 'react';
import { AgGridReact } from "ag-grid-react";
import "ag-grid-community/dist/styles/ag-grid.css";
import "ag-grid-community/dist/styles/ag-theme-balham.css";

function App() {

  const columns = [
    { headerName: "Open", field: "1. open" },
    { headerName: "High", field: "2. high" },
    { headerName: "Low", field: "3. low" },
    { headerName: "Close", field: "4. close" },
    { headerName: "Adjusted Close", field: "5. adjusted close"}
    ];
  
 
  
    const [rowData, setRowData] = useState([]);
    const API_KEY = 'api key';
    let StockSymbol = 'FB';
    let API_Call = `https://www.alphavantage.co/query?function=TIME_SERIES_DAILY&symbol=${StockSymbol}&apikey=${API_KEY}`;
    
   
    useEffect(() => {
    fetch(API_Call)
    .then(res => res.json())
    .then(data => data.Time_series_daily)
    .then(Time_series_daily =>
    Time_series_daily.map(stock => {
  return {
  
    Open: stock['1. open'],
    High: stock['1. high'],
    Low:  stock['1. low'],
    Close: stock['1. close'],
    Adjusted_Close: stock['1. adjusted close'],
  };
  })
  )
  .then(boo => setRowData(boo));
  }, []);
  
    return (
      <div
      className="ag-theme-balham"
      style={{
      height: "300px",
      width: "800px"
      }}
      >
      <AgGridReact columnDefs={columns} rowData={rowData} />
      </div>
      );
}



export default App;

从“React”导入React；
导入“/App.css”；
从“react”导入{useState，useEffect}；
从“ag grid react”导入{AgGridReact}；
导入“ag-grid-community/dist/styles/ag-grid.css”；
导入“ag-grid-community/dist/styles/ag-theme-balham.css”；
函数App（）{
常量列=[
{headerName:“打开”，字段：“1.打开”}，
{headerName:“High”，字段：“2.High”}，
{headerName:“低”，字段：“3.低”}，
{headerName:“Close”，字段：“4.Close”}，
{headerName:“调整后关闭”，字段：“5.调整后关闭”}
];
const[rowData，setRowData]=useState（[]）；
常量API_KEY='API KEY'；
设StockSymbol='FB'；
让API_调用=`https://www.alphavantage.co/query?function=TIME_SERIES_DAILY&symbol=${StockSymbol}&apikey=${API_KEY}`；
useffect（（）=>{
获取（API_调用）
.then（res=>res.json（））
.then（data=>data.Time\u series\u daily）
。然后（时间序列每日=>
Time_series_daily.map（股票=>{
返回{
未平仓：股票['1.未平仓]，
高：股票['1.高']，
低：股票['1.低']，
关闭：股票['1.关闭']，
调整后的收盘价：股票['1.调整后的收盘价']，
};
})
)
。然后（boo=>setRowData（boo））；
}, []);
返回(
);
}
导出默认应用程序；