如何在React JS中获取API并将数据保存到MongoDB

import React, { useEffect, useState } from 'react';

const App = () => {
  const [data, setData] = useState([]);

  useEffect(() => {
    const fetchData = async () => {
      try {
        const response = await fetch('API_URL');
        const jsonData = await response.json();
        setData(jsonData);
      } catch (error) {
        console.log(error);
      }
    };

    fetchData();
  }, []);

  return (
    <div>
      {/* 渲染数据到页面 */}
    </div>
  );
};

export default App;

const express = require('express');
const router = express.Router();
const mongoose = require('mongoose');

// 连接MongoDB数据库
mongoose.connect('mongodb://localhost:27017/mydatabase', {
  useNewUrlParser: true,
  useUnifiedTopology: true,
});

// 创建数据模型
const dataSchema = new mongoose.Schema({
  // 定义数据模型的字段
});

const Data = mongoose.model('Data', dataSchema);

// 处理保存数据的请求
router.post('/saveData', async (req, res) => {
  try {
    const newData = new Data(req.body);
    await newData.save();
    res.status(200).json({ message: 'Data saved successfully' });
  } catch (error) {
    console.log(error);
    res.status(500).json({ message: 'Error saving data' });
  }
});

module.exports = router;

import React, { useEffect, useState } from 'react';
import axios from 'axios';

const App = () => {
  const [data, setData] = useState([]);

  useEffect(() => {
    const fetchData = async () => {
      try {
        const response = await fetch('API_URL');
        const jsonData = await response.json();
        setData(jsonData);

        // 将数据保存到MongoDB
        await axios.post('BACKEND_API_URL/saveData', jsonData);
      } catch (error) {
        console.log(error);
      }
    };

    fetchData();
  }, []);

  return (
    <div>
      {/* 渲染数据到页面 */}
    </div>
  );
};

export default App;