From 86846486ac16fbeb16f3c220c8d9498568155615 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E8=8F=B2=E9=B8=BD?= <1020103647@qq.com>
Date: Fri, 3 May 2024 19:16:54 +0800
Subject: [PATCH] =?UTF-8?q?refine:=20=E5=86=8D=E6=AC=A1=E7=AE=80=E5=8C=96?=
 =?UTF-8?q?=E8=AF=B7=E6=B1=82?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/pages/index/request2.vue |  9 ++++-----
 src/service/index/foo.d.ts   |  4 ----
 src/service/index/foo.ts     | 18 ++++++++++++------
 3 files changed, 16 insertions(+), 15 deletions(-)
 delete mode 100644 src/service/index/foo.d.ts

diff --git a/src/pages/index/request2.vue b/src/pages/index/request2.vue
index 0c66d8e..3f63f9e 100644
--- a/src/pages/index/request2.vue
+++ b/src/pages/index/request2.vue
@@ -13,21 +13,20 @@
     <button @click="getFoo" class="my-6">测试 GET 请求</button>
     <view class="text-xl">请求数据如下</view>
     <view v-if="loading" class="text-blue h-10">加载中...</view>
+    <view v-if="error" class="text-red h-10">请求错误</view>
     <view v-else class="text-green h-10">{{ JSON.stringify(data) }}</view>
     <button class="my-6" type="warn" @click="reset">一键清空数据</button>
   </view>
 </template>
 
 <script lang="ts" setup>
-import { getFooAPI, IFooItem } from '@/service/index/foo'
+import { getFooAPI2, IFooItem } from '@/service/index/foo'
 import { httpGet } from '@/utils/http'
 
 // 适合少部分全局性的接口————多个页面都需要的请求接口，额外编写一个 Service 层
-// const { loading, data, run } = useRequest<IFooItem>(() => getFooAPI('菲鸽'), { immediate: true })
+const { loading, error, data, run } = useRequest<IFooItem>(() => getFooAPI2('菲鸽'))
 // 再次简化，一行代码搞定，方便一次性的请求，适用大部分请求
-const { loading, data, run } = useRequest<IFooItem>(() => httpGet('/foo', { name: '菲鸽' }), {
-  immediate: true,
-})
+// const { loading, error, data, run } = useRequest<IFooItem>(() => httpGet('/foo', { name: '菲鸽' }))
 
 const getFoo = () => run()
 const reset = () => {
diff --git a/src/service/index/foo.d.ts b/src/service/index/foo.d.ts
deleted file mode 100644
index 81bc41a..0000000
--- a/src/service/index/foo.d.ts
+++ /dev/null
@@ -1,4 +0,0 @@
-export interface IFooItem {
-  id: string
-  name: string
-}
diff --git a/src/service/index/foo.ts b/src/service/index/foo.ts
index 30cc470..7263dfc 100644
--- a/src/service/index/foo.ts
+++ b/src/service/index/foo.ts
@@ -1,9 +1,10 @@
-import { http } from '@/utils/http'
-import type { IFooItem } from './foo.d'
+import { http, httpGet } from '@/utils/http'
+export interface IFooItem {
+  id: string
+  name: string
+}
 
-export { IFooItem }
-
-/** get 请求 */
+/** GET 请求 */
 export const getFooAPI = (name: string) => {
   return http<IFooItem>({
     url: `/foo`,
@@ -12,7 +13,12 @@ export const getFooAPI = (name: string) => {
   })
 }
 
-/** get 请求 */
+/** GET 请求 - 再次简化，看大家是否喜欢这种简化 */
+export const getFooAPI2 = (name: string) => {
+  return httpGet<IFooItem>('/foo', { name })
+}
+
+/** POST 请求 */
 export const postFooAPI = (name: string) => {
   return http<IFooItem>({
     url: `/foo`,