跳到主要内容
版本:v2

串行请求的useRequest

策略类型

use hook

在使用扩展 hooks 前,确保你已熟悉了 alova 的基本使用。

这个 use hook 比在最佳实践中的串行请求更加简洁易用,统一的 loading 状态、error、回调函数。

特性

  • 更加简洁易用的串行方式;
  • 统一的请求状态和回调函数;
  • send 函数可触发多个请求串行执行;

示例

串行请求

安装

# npm
npm install @alova/scene-vue --save
# yarn
yarn add @alova/scene-vue

使用

基本用法

useRequest的用法一样,只是第一个参数改变成了一个串行执行的 handler 数组,每个 handler 将接收上一个请求的响应数据。

const {
// 串行加载状态,全部请求完成才会改为false
loading,

// 最后一个请求的响应数据
data,

// 任意一个请求错误都将在这记录错误信息
error,

// 手动发送串行请求
send,

// 串行请求成功回调绑定函数
onSuccess,

// 串行请求错误回调绑定函数,任意一个请求错误都将触发它
onError,

// 串行请求完成回调绑定函数
onComplete
} = useSerialRequest(
[
// args为send函数传入的参数
(...args) => request1(args),

// 从第二个handler开始,第一个参数为上一个请求的响应数据,args从第二个开始接收
(response1, ...args) => request2(response1, args),
(response2, ...args) => request3(response2, args)
],
{
immediate: false
}
);

// 手动触发请求并传参
send(1, 2, 3);

值得注意的是,handler 数组中的第一项也可以指定为一个 method 实例,从第二项开始必须为函数。

useSerialRequest([
methodInstance,
(response1, ...args) => request2(response1, args),
(response2, ...args) => request3(response2, args)
]);

请求错误

串行请求任意一个请求错误时,将会触发onError,它的event.method将指向请求错误的 method 实例。

API

Hook 配置

继承useRequest所有配置。

响应式数据

继承useRequest所有响应式数据。

操作函数

继承useRequest所有操作函数。

事件

继承useRequest所有事件。