useEffect之外的React API调用

Question

我很好奇，是否在lifecycle / useEffect之外发出API请求是否是拨打电话的有效方法？

https://stackblitz.com/edit/react-useeffect-button具有两个功能组件，父组件进行API调用并将数据传递给child component，最初将要从端点获取的数据限制指定为2，而父组件具有[ C0]函数作为LoadMore与数据一起传递到prop。

使用child component在react-slick slider中显示图像，然后使用“加载”按钮child component调用父组件内部的函数onClick，然后进行API调用并将来自API的新数据附加到旧数据。加载按钮会将一张图像添加到现有图像上。

这是发出API请求的好方法，还是仅应在生命周期方法中完成？

Answer 1

这是根据您的需要而辩护。

如果您认为只要更改参数，就会触发API调用。在这种情况下，您应该在useEffect内设置api调用。

[如果要在页面加载（ComponentDidMount）时触发api调用。在这种情况下，您应该在useEffect中设置API调用

否则，无需在useEffect内设置api调用。

Answer 2

如果您要进行API调用以从初始渲染中获取数据，则使用生命周期挂钩是一个好方法。在您的方案中，您想在按下按钮时发出API请求。在这种情况下，它可以是一个简单的函数，而无需任何生命周期挂钩方法。

这里唯一的关键部分是您要维护状态并从状态渲染视图。

Answer 3

这是在useEffect / lifecycle之外发出API请求的好方法吗？

取决于您的要求。

应该仅在生命周期方法中完成吗？

取决于您的要求。

---

在useEffect之外发出API请求没有错。 但是应该在其他功能中完成它，否则它将导致请求在每次重新呈现时继续进行。并且如果响应被保存在一个状态变量中。

然后它将进入无限循环。