ahooks之useRequest

一：作用：

简述一下，可以不看下面的内容：就是为了方便写请求的，和在useEffect中请求异曲同工。

1. 简化数据请求逻辑: useRequest 封装了数据请求的逻辑，包括发送请求、处理 loading 状态、错误处理等，使得在组件中发起数据请求变得更加简单和直观。

2. 提供配置选项: useRequest 提供了丰富的配置选项，可以满足不同场景下的需求。比如可以配置请求方法、请求参数、成功回调、失败回调等，从而灵活地控制数据请求的行为。

3. 管理请求状态: useRequest 返回的数据包括 loading、error、data 等状态，可以方便地在组件中根据这些状态进行 UI 的展示和交互逻辑。

4. 支持手动触发请求: 通过配置 manual: true，可以实现手动触发请求的功能，使得数据请求的时机更加灵活可控。

5. 提供数据缓存: useRequest 支持数据的缓存功能，可以在多次请求中缓存数据，避免重复请求相同的数据

二：操作步骤：（简单示例）

import { useRequest } from '@ahooksjs/use-request';

const fetchData = async (params) => {
  // 使用传入的参数来发起数据请求
};

const ExampleComponent = ({ missionId }) => {
  const { data, loading, error, run } = useRequest(fetchData, {
    manual: true,
    onSuccess: (result) => {
      // 请求成功时的处理逻辑
    },
    onError: (err) => {
      // 请求发生错误时的处理逻辑
    },
  });

  // 在需要的时候手动触发请求，并传递参数
  useEffect(() => {
    run({ missionId });
  }, [missionId]);

  return (
    // 根据 loading、error 和 data 渲染组件
  );
};