Question

是在组件中分派API调用的最佳钩子。通常我使用useMemo在第一个渲染上调用API，如果需要其他副作用，请使用useEffect，这是正确的吗？因为有时我会遇到以下错误：

'''index.js：1警告：渲染另一个组件（Inscriptions）时无法更新组件（PaySummary）。要在PaySummary内找到错误的setState（）调用，请按照...''''

中所述跟踪堆栈

当我路由到一个组件并迅速更改为另一个组件时，就会发生这种情况，因为如果我返回到它按预期正确呈现的前一个组件，则不会“影响”一般的行为。那我该怎么办呢？

Answer 1

调用 API 是一种副作用，您应该使用 useEffect，而不是 useMemo

Per the React docs for useEffect：

<块引用>

在 React 组件中获取数据、设置订阅和手动更改 DOM 都是副作用的示例。无论您是否习惯将这些操作称为“副作用”（或简称为“效果”），您之前可能已经在组件中执行过它们。

<块引用>

请记住，传递给 useMemo 的函数在渲染期间运行。不要在那里做任何你在渲染时通常不会做的事情。比如副作用属于useEffect，而不是useMemo。

在渲染期间或使用 useMemo 执行这些副作用（和修改状态）是您遇到您提到的错误的原因。

Answer 2

基本上，我宁愿以useEffect的方式使用componentDidMount，而不必像下面那样依赖


useEffect(() => {

  // Api call , or redux async action here...

}, [])

用于在组件安装状态下调用api。在大多数情况下，我发现自己使用useMemo在功能组件渲染级别存储数据，防止变量重新创建并在渲染之间持久保存创建的数据（依赖项更改除外）。

但是对于您所要解决的问题，有一个名为useLayoutEffect的钩子，该钩子主要用于在绘制DOM之前执行操作，但是正如我在大多数项目中所说的，大多数时候我发现在一个简单的useEffect，也就是没有依赖项，即完成了组件的装载，以便为组件加载所需的数据！