Javascript 从Node.js中的API获取数据并发送到Reactjs

我试图从Nodejs中的API获取数据，然后将数据发送到Reactjs。我不能直接在Reactjs中获取数据，因为我需要提供API密钥，所以为此，我使用Nodejs。我正在使用Axios获取数据。问题是，由于Axios仅在完全获取所有数据后才发送数据，因此显示数据需要3-4秒以上，这不是很好。我想知道如何在每次间隔后显示数据，或者在Axios获取一些数据后，继续显示数据并同时加载其余部分。我在后端部分的代码是

const express = require('express');
const axios = require('axios');
const bodyParser = require('body-parser');
const cors = require('cors');
const app = express();
app.use(cors());
app.use(express.json());
app.use(bodyParser.urlencoded({ extended: true }));

app.get('/getdata', function (req, res) {
    const fetchData = async () => {
        const data = await axios(`${APIurl}?${APIKey}`)
        res.send(data.data);
    }
    fetchData();
})

app.listen(5000);

Reactjs部分的代码如下所示

import React, { useState, useEffect } from 'react'
import axios from 'axios';
const Projects = () => {
    const [data, updateData] = useState([]);
    useEffect(() => {
        axios.get('http://localhost:5000/getdata')
            .then(res => updateData(res.data))
            .catch(error => console.log("Error"))
    }, [])
   
    return (
            {data.map(project => (
                 <div key={project["id"]}>
                      <div>{project["name"]}</div>
                 </div>
             ))}
    )
}

export default Projects

import React，{useState，useffect}来自“React”
从“axios”导入axios；
const项目=（）=>{
const[data，updateData]=useState（[]）；
useffect（（）=>{
axios.get（）http://localhost:5000/getdata')
.然后（res=>updateData（res.data））
.catch（错误=>console.log（“错误”））
}, [])
返回(
{data.map（项目=>(
{project[“name”]}
))}
)
}
导出默认项目

---

那么，如何从后端代码发送数据，使其在每个特定间隔后显示数据呢？

似乎是API的一个很好的使用案例

实现细节将在很大程度上取决于您是否希望自己实现其中任何一个，或者是否希望使用某些库/服务（例如），以及这两个API中哪一个最适合您的项目