vue-request

VueRequest：一个能轻松帮你管理请求状态（支持SWR、轮询、错误重试、缓存、分页等）的Vue3 Composition API请求库。

数据请求

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

1
2
3

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

函数（推荐）

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

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18



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处理数据请求，所以不研究这套方案）

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16



import {useRequest} from 'vue-request';

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

// 对象
const objectService = {
    url: '',
    method: 'POST',
    headers: new Headers({
        'Content-Type': 'application/json',
    }),
}
const { data } = useRequest(objectService);