问题描述
在尝试将获取的值分配给 React 状态之前,如何验证 MongoDB 中是否有任何文档?
useEffect(() => {
const resp = async () => {
await axios.get('http://localhost:4000/app/totalbalance')
.then(
result => setInsertedValue(result.data[0].totalBalance))
}
resp();
},[]);
当数据库中至少有 1 个文档时,它工作正常。我如何添加验证来检查 MongoDB 中是否至少有一个文档,否则应用程序不会崩溃?
谢谢!
解决方法
假设您的问题是如何在设置反应状态之前确保 result.data
中有内容,
在没有文档返回时使用默认值(代码中的 -1)确保应用不会崩溃的一种方法:
useEffect(() => {
const resp = async () => {
await axios.get('http://localhost:4000/app/totalbalance')
.then(
result => setInsertedValue(result.data && result.data.length>0 ? result.data[0].totalBalance : -1))
}
resp();
},[]);
如果默认值与您的输出混淆(例如,-1 是一个有效的插入值),最好使用默认值 null
并处理渲染中的条件。>
一个例子是:
useEffect(() => {
const resp = async () => {
await axios.get('http://localhost:4000/app/totalbalance')
.then(
result => setInsertedValue(result.data && result.data.length>0 ? result.data[0].totalBalance : null))
}
resp();
},[]);
return (
<>
{
insertedValue === null ? <p> no data found </p> :<p></p> // logic when documents exists.
}
</>
);
这里,我们默认 insertedValue = null
以防没有来自 mongoDB 的数据并将组件渲染为警报,没有找到来自 mongodb 的文档。在找到文档的情况下,代码正常运行!
希望这能解决您的问题,如果这让您更加困惑,请提前道歉。谢谢!