Toggle navigation
Toggle navigation
This project
Loading...
Sign in
Hooke
/
jgdl
Go to a project
Toggle navigation
Toggle navigation pinning
Projects
Groups
Snippets
Help
Project
Activity
Repository
Pipelines
Graphs
Issues
0
Merge Requests
0
Wiki
Snippets
Network
Create a new issue
Builds
Commits
Issue Boards
Authored by
hookehuyr
2025-08-25 11:12:49 +0800
Browse Files
Options
Browse Files
Download
Email Patches
Plain Diff
Commit
b0e57e1267b4bbbd29c79784af37829b17e6e7b4
b0e57e12
1 parent
8a6cc8f3
docs: 更新README文档中的API使用示例和错误处理说明
Hide whitespace changes
Inline
Side-by-side
Showing
1 changed file
with
230 additions
and
3 deletions
README.md
README.md
View file @
b0e57e1
...
...
@@ -140,11 +140,238 @@ export const updateProfileAPI = (params) => fn(fetch.post(Api.UPDATE_PROFILE, pa
#### 3. 错误处理机制
`fn()`
函数自动处理API响应:
-
成功时返回
`response.data`
-
失败时显示错误提示并返回
`false`
`fn()`
函数处理API响应并返回标准格式:
-
返回格式:
`{ code, msg, data }`
-
`code === 1`
表示请求成功,其他值表示失败
-
`msg`
包含服务器返回的提示信息
-
`data`
包含具体的业务数据
-
特殊处理"计全付"相关错误,使用模态框显示
#### 4. API使用示例
##### 在组件中调用API
```
javascript
<
script
setup
>
import
{
ref
,
onMounted
}
from
'vue'
;
import
{
getProfileAPI
,
updateProfileAPI
}
from
'@/api/index'
;
import
{
getVehicleListAPI
,
addVehicleAPI
}
from
'@/api/car'
;
import
{
getOrderListAPI
}
from
'@/api/orders'
;
// 响应式数据
const
userInfo
=
ref
({});
const
vehicleList
=
ref
([]);
const
orderList
=
ref
([]);
const
loading
=
ref
(
false
);
// 获取用户信息
const
fetchUserProfile
=
async
()
=>
{
loading
.
value
=
true
;
try
{
const
{
code
,
msg
,
data
}
=
await
getProfileAPI
();
if
(
code
===
1
)
{
userInfo
.
value
=
data
;
console
.
log
(
'用户信息获取成功:'
,
data
);
}
else
{
console
.
error
(
'获取用户信息失败:'
,
msg
);
}
}
catch
(
error
)
{
console
.
error
(
'获取用户信息异常:'
,
error
);
}
finally
{
loading
.
value
=
false
;
}
};
// 更新用户资料
const
updateProfile
=
async
(
profileData
)
=>
{
const
params
=
{
nickname
:
profileData
.
nickname
,
avatar_url
:
profileData
.
avatar_url
,
gender
:
profileData
.
gender
};
const
{
code
,
msg
,
data
}
=
await
updateProfileAPI
(
params
);
if
(
code
===
1
)
{
console
.
log
(
'资料更新成功:'
,
msg
);
// 重新获取用户信息
await
fetchUserProfile
();
}
};
// 获取车辆列表
const
fetchVehicleList
=
async
()
=>
{
const
params
=
{
page
:
1
,
limit
:
10
,
status
:
1
// 1-在售 2-已售
};
const
{
code
,
msg
,
data
}
=
await
getVehicleListAPI
(
params
);
if
(
code
===
1
)
{
vehicleList
.
value
=
data
.
list
;
console
.
log
(
'车辆列表:'
,
data
);
}
};
// 添加车辆
const
addVehicle
=
async
(
vehicleData
)
=>
{
const
params
=
{
brand_id
:
vehicleData
.
brand_id
,
model_id
:
vehicleData
.
model_id
,
price
:
vehicleData
.
price
,
description
:
vehicleData
.
description
,
images
:
vehicleData
.
images
,
// 图片数组
contact_phone
:
vehicleData
.
contact_phone
};
const
{
code
,
msg
,
data
}
=
await
addVehicleAPI
(
params
);
if
(
code
===
1
)
{
console
.
log
(
'车辆添加成功:'
,
msg
);
// 刷新车辆列表
await
fetchVehicleList
();
}
};
// 获取订单列表
const
fetchOrderList
=
async
(
status
=
''
)
=>
{
const
params
=
{
page
:
1
,
limit
:
20
};
if
(
status
)
{
params
.
status
=
status
;
// 订单状态筛选
}
const
{
code
,
msg
,
data
}
=
await
getOrderListAPI
(
params
);
if
(
code
===
1
)
{
orderList
.
value
=
data
.
list
;
console
.
log
(
'订单列表:'
,
data
);
}
};
// 页面加载时获取数据
onMounted
(()
=>
{
fetchUserProfile
();
fetchVehicleList
();
fetchOrderList
();
});
<
/script
>
```
##### 带错误处理的API调用
```
javascript
// 完整的错误处理示例
const
handleApiCall
=
async
(
apiFunction
,
params
,
successMessage
=
''
)
=>
{
loading
.
value
=
true
;
try
{
const
{
code
,
msg
,
data
}
=
await
apiFunction
(
params
);
if
(
code
===
1
)
{
// API调用成功
if
(
successMessage
)
{
// 显示成功提示
Taro
.
showToast
({
title
:
successMessage
,
icon
:
'success'
});
}
return
{
code
,
msg
,
data
};
}
else
{
// API返回失败,显示服务器返回的错误信息
Taro
.
showToast
({
title
:
msg
||
'操作失败'
,
icon
:
'none'
});
return
false
;
}
}
catch
(
error
)
{
// 网络错误或其他异常
console
.
error
(
'API调用异常:'
,
error
);
Taro
.
showToast
({
title
:
'网络异常,请稍后重试'
,
icon
:
'none'
});
return
false
;
}
finally
{
loading
.
value
=
false
;
}
};
// 使用示例
const
saveProfile
=
async
()
=>
{
const
result
=
await
handleApiCall
(
updateProfileAPI
,
{
nickname
:
'新昵称'
},
'资料保存成功'
);
if
(
result
)
{
// 处理成功后的逻辑
await
fetchUserProfile
();
}
};
```
##### 分页数据加载示例
```
javascript
// 分页加载车辆列表
const
vehicleListData
=
ref
({
list
:
[],
page
:
1
,
limit
:
10
,
total
:
0
,
hasMore
:
true
});
// 加载车辆列表(支持分页和下拉刷新)
const
loadVehicleList
=
async
(
refresh
=
false
)
=>
{
if
(
refresh
)
{
vehicleListData
.
value
.
page
=
1
;
vehicleListData
.
value
.
list
=
[];
vehicleListData
.
value
.
hasMore
=
true
;
}
if
(
!
vehicleListData
.
value
.
hasMore
)
return
;
const
params
=
{
page
:
vehicleListData
.
value
.
page
,
limit
:
vehicleListData
.
value
.
limit
,
status
:
1
};
const
{
code
,
msg
,
data
}
=
await
getVehicleListAPI
(
params
);
if
(
code
===
1
)
{
const
{
list
,
total
}
=
data
;
if
(
refresh
)
{
vehicleListData
.
value
.
list
=
list
;
}
else
{
vehicleListData
.
value
.
list
.
push
(...
list
);
}
vehicleListData
.
value
.
total
=
total
;
vehicleListData
.
value
.
page
++
;
// 判断是否还有更多数据
vehicleListData
.
value
.
hasMore
=
vehicleListData
.
value
.
list
.
length
<
total
;
}
};
// 下拉刷新
const
onRefresh
=
()
=>
{
loadVehicleList
(
true
);
};
// 上拉加载更多
const
onLoadMore
=
()
=>
{
loadVehicleList
(
false
);
};
```
### 网络请求配置
#### 1. 环境配置
...
...
Please
register
or
login
to post a comment