当前用于网络请求的Hooks是很多的,但是为什么选择使用useRequest呢?
- 目前的许多Hooks都需要根据不同的场景来选择,比如分页usePagination,加载更多useLoadMore
- useAsync能力不足,不能支持并行请求
- useRequest不仅包含来Umi Hooks所有和网络请求相关的Hooks,还借鉴了swr的特性
swr的主要能力在于:我们在发送网络请求时,会优先返回缓存内的数据,然后在背后发起网络请求,最终用新的请求结果来触发组件渲染。
一.useRequest的基本使用
这是一个最简单的网络请求示例。在这个例子中 useRequest 接收了一个 Promise 函数。在组件初始化时,会自动触发 getUsername 执行,并自动管理 data 、 loading 、 error 等数据。
二.一些基础的params
- 手写请求:设置
manual : true
,即可阻止初始化发送service,只有触发run('xxxxx')
才会发送service服务,run中的参数会传给service - 轮询:对需要时刻更新的数据,我们需要不断的发起网络请求,使用
pollingInterval:时间
- 并行请求:对相同的类型,只维护一次请求,对多个类型,维护多次请求,使用
fetchKey
- 防抖:
debounceInterval:时间
节流:throttleInterval:时间
- swr:
cacheKey
- 分页:
paginated:true
注意:
三.集成请求库
如果useRequest第一个参数不是异步请求方法Promise,而是object,array等,则自动使用umi-request发送网络请求
通过使用requestMethod
,可以使用其他的请求库