我现在很困惑。学习js前端以及如何发出API请求。到目前为止，每当我进行 API 调用时，我总是使用一些可以让我处理异步请求（axios或thunk）的东西。但现在我遇到了一个案例，我正在向我的 Firebase/Firestore 发出请求，并且在我观看的 yt 视频中，仅useEffect使用了该请求。没有任何async/await，例如：useEffect(() => { // snapshot - to check, if there is a change (like a new entry) in the database db.collection('products').onSnapshot((snapshot) => { setProducts(snapshot.docs.map((doc) => doc.data())); });}, []);为什么是这样？
2 回答
杨__羊羊
TA贡献1943条经验 获得超7个赞
在示例代码片段中
useEffect(() => {
// snapshot - to check, if there is a change (like a new entry) in the database
db.collection("products").onSnapshot(snapshot => {
setProducts(snapshot.docs.map(doc => doc.data()))
})
}, []);
db.collection("products")管理自己的异步事件处理。当收到“快照”事件时，它会调用onSnapshot回调并更新状态。没有什么可以等待的，特别是因为没有返回值。
您还应该注意，useEffect钩子回调是 100%同步代码，它们不能被标记async和await任何代码调用。然而，他们可以调用async自己进行等待等的函数。
关于你标题中的问题
任何时候您想要从组件生命周期中发出任何副作用时，都可以使用useEffect挂钩，例如控制台日志记录状态、获取数据、调度操作。这主要是因为函数式 React 组件的整个函数体都被视为纯函数。with dependency 更类似于基于类的组件的、和生命周期方法。它们只是作为 React 组件生命周期的一部分被单独调用。useEffectcomponentDidMountcomponentDidUpdatecomponentWillUnmount
每当您需要获取数据时，请使用 、 或 或任何其他数据获取axios代码。fetch
蛊毒传说
TA贡献1895条经验 获得超3个赞
useEffect() - 它是一个钩子，允许我们在功能组件（如网络请求等）中执行副作用。
Axios - 它只是一个库，我们可以在其中发出 http 请求，例如 JavaScript 中的 fetch API，而且 axios 是基于 Promise 的。
添加回答
举报
0/150
提交
取消