解决常见的 useEffect 陷阱

在 React 中，useEffect 是一个非常常用的钩子函数，用于处理组件的副作用操作。它在组件渲染完成后执行，可以用于订阅事件、获取数据、执行清理操作等。然而，使用 useEffect 时可能会遇到一些常见的陷阱。本文将介绍一些常见的 useEffect 陷阱，并提供相应的源代码示例。

1. 无限循环的副作用操作

有时，可能会在 useEffect 中触发导致组件重新渲染的状态更新操作，从而导致副作用操作无限循环执行。这种情况下，可以通过传递第二个参数给 useEffect 来解决。第二个参数是一个数组，包含了所有需要监视变化的状态。只有当数组中的状态发生变化时，useEffect 才会重新运行，否则它将被跳过。

import React, {
   
    useEffect, useState } from 'react'