我的請求很好,但我想知道如何在 React 中使用我的回應。
SQL 請求:
```
exports.countAllComments = async (req, res) => {
const pId = req.params.id;
db.query(
"SELECT COUNT(*) FROM comments WHERE post_id = ?",
[pId],
(err, count) => {
if (err) {
res.status(500).json({ err });
console.log(err);
} else {
console.log(count)
res.status(200).json(count);
}
}
);
};
```
獲取計數的前端:
```
const [countData, setCountData] = useState(0);
useEffect(() => {
const fetchCount = async () => {
try {
const fetchData = await Axios.get(
`http://localhost:3001/api/post/comment-count/${post.id}`,
{
headers: { Authorization: `Bearer ${test1.token}` },
}
);
setCountData(fetchData.data[0]);
} catch (err) {}
};
fetchCount();
}, [post.id, test1.token]);
console.log(countData);
```
控制臺日志回傳:“{COUNT(*): 4}”我怎樣才能得到(4)
uj5u.com熱心網友回復:
鑒于您的微不足道的例子,微不足道的解決方案將是這樣的 -
fetchData.data[0]['COUNT(*)']
但是,您真的應該考慮一下 API 上的契約,并從您的 API 強制執行某種回傳型別,而不僅僅是簡單地從 SQL 查詢回傳回應。即您的 API 可能會回傳一個物件,如 -
{ count: x }
由你的 API 以一種滿足契約的方式轉換 SQL 查詢的結果,這樣你的 React 客戶端就與你的資料庫層斷開連接,只關心你的 API 契約。
這樣你的客戶端就會變成這樣 -
fetchData.data.count
如果以某種方式更新查詢的位置等,這不會中斷。
轉載請註明出處,本文鏈接:https://www.uj5u.com/houduan/383573.html
標籤:javascript mysql 反应
上一篇:將div定位到單擊的按鈕的角落
