如何从MongoDB中获取数据？

IT技术 reactjs mongodb axios
2021-05-21 06:09:46

我正在尝试使用 Express + MongoDB 构建 React 应用程序。

我能够将一些文档发布到 MongoDB。目前，我正试图弄清楚如何将获取的数据打印到屏幕上。

我有这些路线：

router.post('/totalbalance', (request, response) => {
    const totalBalance = new TotalBalanceModelTemplate({
        totalBalance:request.body.totalBalance,
    });
    totalBalance.save()
    .then(data => {
        response.json(data);
    })
    .catch(error => {
        response.json(error);
    });
});

router.get('/totalbalance', (request, response) => {
    TotalBalanceModelTemplate.find(request.body.totalBalance, (error, data) => {
        if (error) {
            return error
        } else {
            response.json(data[0])
        }
    })
});

这是 axios 请求：

   useEffect(() => {
        const resp = axios.get('http://localhost:4000/app/totalbalance');

        console.log(resp);
    }, []);

它返回一个Promise，该Promise的参数data等于对象值，该值是数组中的第一个值

data: {_
    id: "60c48b4ec60919553d92319f", 
    totalBalance: 5555, 
    __v: 0
}

并将其打印到控制台。

如何将值totalBalance而不是整个Promise打印到控制台？

顺便说一句，有时数组data为空（数据库中没有文档），我应该如何处理这些情况？

谢谢！

2个回答

首先，Axios GET 方法没有任何请求体。但是您正在尝试在 MongoDB 查询中使用它。- "TotalBalanceModelTemplate.find(request.body.totalBalance, (error, data) => {"。

查找查询应该是对象 {}。如果需要将条件传递给它。

第一点，仅打印“totalBalance”输出。使用，console.log(resp.totalBalance);

第二点，要处理记录长度，有一个 if else 条件，

    if (error) {
       return error
    } else if (data.length) {
       return response.send("No records found")
    } else {
       response.json(data[0])
    }

试试这个 ：

路线

router.post("/totalbalance", async (req, res) => {
  try {
    const totalBalance = new TotalBalanceModelTemplate({
        totalBalance: req.body.totalBalance,
    })
    await totalBalance.save();
    res.json(totalBalance)
  } catch (error) {
    res.status(400).json({
      message: error.message
    })
  }
})

router.get("/totalbalance", async (req, res) => {
  try {
    const totalBalances = await TotalBalanceModelTemplate.find();
    res.json(totalBalances)
  } catch (error) {
    res.status(400).json({
      message: error.message
    })
  }
})

应用程序.js

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

export default function App() {
  const [data, setData] = useState([]);

  const getData = async () => {
    try {
      const response = await axios.get('http://localhost:4000/app/totalbalance');
      await setData(response);
    } catch (error) {
      console.log(error);
    }
  };

  useEffect(() => {
    getData();
  }, []);

  return (
    <div>
      {data <= 0 ? (
        <div className="empty">
          <p>No data!</p>
        </div>
      ) : (
        data.map((d) => (
          <ul key={d.id}>
            <li>{d.totalBalance}</li>
          </ul>
        ))
      )}
    </div>
  );
}
其它你可能感兴趣的问题
上一篇为珠宝制作正确的树脂铸件的正确工艺是什么？ 下一篇如何校准 Repetier 固件中的温度控制？