style: 优化全屏 loading hook 命名 (#44)

src/api/mock.ts

@@ -31,23 +31,23 @@ export function getRemoteSelectData() {
   })
 }
 
-export interface IBirdsItem {
+export interface IComicsItem {
   id: number
   name: string
 }
 
-export const getBirds = () => {
-  return new Promise<IBirdsItem[]>((resolve) => {
+export const getComics = () => {
+  return new Promise<IComicsItem[]>((resolve) => {
     setTimeout(() => {
-      resolve([...Array(5)].map((_t, index) => ({ id: index, name: `t${index}` })))
+      resolve([...Array(5)].map((_t, index) => ({ id: index, name: `c${index}` })))
     }, 1000)
   })
 }
 
-export const getCars = (id: number) => {
+export const getAnimations = (id: number) => {
   return new Promise((_resolve, reject) => {
     setTimeout(() => {
-      reject(new Error("sorry" + id))
+      reject(new Error(`Sorry, there is an error here. The error id is ${id}`))
     }, 1000)
   })
 }

src/views/hooks/use-fullscreen-loading.vue

@@ -6,13 +6,13 @@
 </template>
 
 <script lang="ts" setup>
-import { getBirds, getCars, type IBirdsItem } from "@/api/mock"
+import { getComics, getAnimations, type IComicsItem } from "@/api/mock"
 import { useFullscreenLoading } from "@/hooks/useFullscreenLoading"
 import { ElMessage } from "element-plus"
 
 const querySuccess = async () => {
-  const birds = await useFullscreenLoading(getBirds)()
-  ElMessage.success(birds.map((t: IBirdsItem) => t.name).join())
+  const comics = await useFullscreenLoading(getComics)()
+  ElMessage.success("Successfully get comics: " + comics.map((t: IComicsItem) => t.name).join())
 }
 
 const svg = `
@@ -28,7 +28,7 @@ const svg = `
 
 const queryFailed = async () => {
   try {
-    await useFullscreenLoading(getCars, {
+    await useFullscreenLoading(getAnimations, {
       text: "自定义加载文字",
       background: "rgba(255, 214, 210, 0.7)",
       svg,