数据请求

const { data, error } = useRequest(service, options);

这是 VueRequest 最基本的 API。这里的 service 可以表示为一个请求接口，它可以是一个 字符串、一个 对象 或者是一个 函数。当请求完成后，则将会根据请求结果来修改 data 和 error。

函数 推荐

查询函数实际上可以是任意一个返回 Promise 的函数，返回的 promise 将决定是传递 data 亦或者是抛出错误，错误将会被 error 捕获。函数的入参将会被当做 params 传递给 API 接口

换句话说，你可以使用 第三方的请求库（如 axios ） 来获取数据，然后将该请求传给 VueRequest 来进行管理。

我们来举个例子 🌰

import { useRequest } from 'vue-request';
import axios from 'axios';

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

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

// ...
run('张三');

顺带一提，你也可以通过函数返回一个 字符串 或者是一个 对象，我们将会使用 fetch 来处理这些数据请求。

import { useRequest } from 'vue-request';

const { data } = useRequest(name => 'api/user?name=' + name);

字符串

当然，如果你的接口足够简单，你也可以通过传入一个接口的链接

import { useRequest } from 'vue-request';

const { data } = useRequest('api/simple');

对象

当然，如果你的接口足够简单，你也可以通过传入一个包含 url 属性的对象

import { useRequest } from 'vue-request';

const objectService = {
  url: 'api/simple',
  method: 'POST',
  headers: new Headers({
    'Content-Type': 'application/json',
  }),
};

const { data } = useRequest(objectService);

---

恭喜你，你已经入门了 VueRequest 了。

什么？还不够用？来来来，后面的章节我们来了解一下一些常用的配置与用法。