前端请求库的演进，本质上是对“数据获取”这一高频场景的不断抽象。

从 XMLHttpRequest 的回调时代，到 fetch / axios 的 Promise 范式。再到 React Query、SWR 的声明式 Hooks，每一次进化都在降低样板代码的复杂度。

目前有一个可以关注的方向：将请求模式进一步抽象为“策略”——不再让开发者手动管理 loading、error、分页状态、轮询定时器等样板逻辑，而是通过语义化的 Hook 直接声明意图。

这篇文章以 alova 为例，分析从 Promise 范式到策略范式这一进化方法的设计思路和应用边界。

Promise 时代：一个场景看样板代码

以分页列表为例——这是前端最常见的场景之一。传统 Promise 方案的代码结构大致如下：

// 传统 Promise方案
import { useState。useEffect,useCallback } from 'react';import axios from 'axios';function TodoList {
const = useState;const = useState;const = useState;const = useState;const pageSize = /*...*/;const = useState;const fetchList = useCallback => {
setLoading;老实说，setError;try {
const res = await axios.get('/api/todos'。{
至于params，{ page,pageSize }
});setList，setTotal;
} catch {
setError;} finally {
setLoading;}
},)，useEffect => { fetchList;},)，老实说，return (

{loading && }
{error && }
{list.map}
 setPage}
/>

);按理说，}

这段代码本身不复杂。但有几个共性问题：

• 状态管理重复loading、error、data 几乎是每个请求都要声明一遍的“三件套”。
• 请求依赖声明不够直观useCallback 与 useEffect 的搭配。本意是“page变化时重新请求”，但实现上需要三层嵌套。
• 刷新触发分散当需要外部触发刷新时需要额外通过状态提高或 ref 来实现。
• 翻页状态外露page、pageSize、total 每个都需要手动维护。

使用者痛点

• 大量重复写死状态，导致代码膨胀。
• 业务逻辑与网络层耦合度高，难以维护。
• 刷新机制分散且易遗漏，影响使用者体验。
• 分页控制全靠组件内部完成，失去可复用性与一致性。

策略化思路这方面，从“怎么做”到“要什么”

Promise方案本质是过程式编程你需要告诉程序“怎么做”——什么时候发请求、怎么管理加载状态、怎么处理错误、怎么刷新。

策略化思路反过来：你只需声明“我要什么”——我需要一个分页列表。我需要一个表单提交，我需要一个轮询——库负责执行策略的具体实现。

alova 提供的一套面向常见场景的 Hook：

三个场景的 Before / After

再看场景一，分页列表

// alova usePagination
import { usePagination } from 'alova/client';老实说，function TodoList {
const {
data,loading,error,page,pageSize,total。send
} = usePagination(
=> alovaInstance.Get('/api/todos',{
至于params，{page,pageSize}
})
);// loading / error / data / page / pageSize / total由Hook统一管理
return (

{loading && }
{error && }
{data.map(item=>}
send}/>

);}

• No need for manual state handling of loading/error/data/page/total.
/// ... rest omitted for brevity due to length constraints