1. 隐式防抖
ultra-debounce 提供的 Axios请求防抖器 “axiosDebouncer” 可以为指定的Axios实例添加请求防抖功能。
import axios from "axios";
import {axiosDebouncer} from "@zhoujianhui/ultra-debounce";
const wait = 1000
axiosDebouncer.addDebounce(axios, wait)
其中:
- axios: Axios实例
- wait: 延迟等待时间(可选,单位:毫秒,默认为:1000)
此时Axios发出的请求均被添加了防抖功能,不需要额外编码。
1.1. 示例
示例项目中有如下服务:
const debounceService = {
debouncedRequest: async () => {
try {
const response = await axios.get("https://reqres.in/api/users/1")
return Result.success("获取用户成功!").data(response.data).build()
} catch (error) {
return Result.error(`获取用户失败!具体原因:${error.message}`).build()
}
}
}
此时快速点击按钮调用 “debounceService.debouncedRequest()” 方法,会发现请求只发出一次,应用提示访问频繁并输出警告日志。