# useRequest

导出 VueRequest 相关核心函数，用于管理接口的状态

::: tip

VueRequest 一个 Vue 请求库

在以往的业务项目中，常常被 loading 状态的管理、请求的节流防抖、接口数据的缓存、分页等这些重复的实现所困惑。每当开启一个新项目时，我们都得手动去处理以上这些问题，这将是一个重复性的工作，而且还得确保团队的一致。

VueRequest 旨在为开发者提供便捷、快速的方式来管理接口的状态。在业务开发中省去上述的那些“脏活累活”，只需要简单的配置即可使用，专注于业务核心的开发。

:::

[VueRequest 官网链接](https://next.attojs.com/)

## Usage

```ts
// main.ts
import { setGlobalOptions } from '@eciol/hooks';

setGlobalOptions({
  manual: true,
});
```

```vue
<script setup lang="ts">
  import { useRequest } from '@eciol/hooks';

  import axios from 'axios';

  const getUser = (userName) => {
    return axios.get('api/user', {
      params: {
        name: userName,
      },
    });
  };

  const { data, run } = useRequest(getUser, {
    defaultParams: ['马冬梅'],
  });

  // ...
  run('张三');
</script>
```

## Export

```ts
/**
 * @description VueRequest库
 */
export {
  /**
   * @description 全局配置
   */
  setGlobalOptions,
  /**
   * @description 加载更多扩展
   */
  useLoadMore,
  /**
   * @description 分页扩展
   */
  usePagination,
  /**
   * @description 数据请求
   */
  useRequest,
  /**
   * @description 使用 useRequestProvider 注入配置，传入的配置只会影响到该组件的子组件
   */
  useRequestProvider,
};
```