import { ref } from "vue" /** * 用于执行 API 请求和管理相关状态的自定义钩子。 * * @param {Function} apiF - 表示 API 请求的异步函数。 * @param {Object} [opt={}] - 可选配置选项。 * @param {Ref} [opt.loading=false] - 可选的 loading 状态变量。 * * @returns {Object} - 包含响应式变量和 fetchData 函数的对象。 * @property {Ref} loading - 表示 API 请求加载状态的 ref。 * @property {Ref} result - 表示 API 请求结果的 ref。 * @property {Ref} error - 表示 API 请求失败时的错误的 ref。 * @property {Function} fetchData - 用于执行 API 请求并更新状态变量的函数。 */ export const useApi = (apiF, opt = {}) => { // 使用 ref 包装状态变量 const loading = opt.loading || ref(false) const result = ref(null) const error = ref(null) /** * 执行 API 请求并更新状态的函数。 * * @param {*} p - 用于 API 请求的参数。 * @returns {Promise} - 包含 API 响应对象的 Promise。 */ const fetchData = async (p) => { try { // 开始请求,设置 loading 为 true loading.value = true // 执行异步 API 请求 const res = await apiF(p) // 根据返回的 code 判断请求是否成功 if (res.code === 0) { // 请求成功,更新 result 变量 result.value = res } else { // 请求失败,更新 error 变量 error.value = res } // 返回 API 响应对象 return res } catch (err) { // 捕获异常,更新 error 变量并抛出错误 error.value = err throw err } finally { // 无论请求成功或失败,都会在最终阶段设置 loading 为 false loading.value = false } } // 返回包含状态变量和 fetchData 函数的对象 return { loading, result, error, fetchData } }