如何处理React中的异步操作和副作用？

处理React中的异步操作和副作用通常有几种方法，每种方法适用于不同的场景和需求：

1. 使用生命周期方法（类组件）:

   • 在类组件中，可以使用生命周期方法如componentDidMount、componentDidUpdate和componentWillUnmount来执行异步操作和副作用。

componentDidMount() {
  this.fetchData();
}

fetchData = () => {
  // 执行异步操作，例如API调用
}

1. 使用****Hooks (useState和useEffect):

   • useState可以用来声明状态变量并更新状态，触发组件的重新渲染。
   • useEffect可以用来处理副作用，包括数据获取、订阅或手动更改DOM等。

import { useState, useEffect } from 'react';

function MyComponent() {
  const [data, setData] = useState(null);

  useEffect(() => {
    const fetchData = async () => {
      const result = await fetch('/api/data');
      con